Threaded Mode | Linear Mode

gabriell.vasile · 10-20-2009, 08:16 AM

Solutia mea este simpla si am preluat ideea de la youtube.
Daca intrati pe site cu ie6, veti vedea un text de genul

   "We will be phasing out support for your browser soon.
   Please upgrade to one of these more modern browsers."

si cateva imagini care te duc catre paginile ie8, firefox 3.5, respectiv google chrome de download.

Practic ce fac cu ajutorul codului de mai jos, evit afisarea website-ului daca incerci sa il vezi cu ie6, afisand cu totul alt continut care te directioneaza catre download-area unui alt browser (ie8, firefox 3.5, chrome)

De altfel, chiar mi-ar placea ca acest thread sa porneasca o campanie anti ie6, pentru a scapa o data si pentru totdeauna de probleme lui.

Mai jos, html-ul care trebuie introdus in pagina principala:

<head>
    <link href="stiluri.css" rel="stylesheet" type="text/css" />
     
</head>

<body>
<div id="gotobetterbrowser"> 
        <div class="error">! ERROR !</div>

        <div class="mesaj">We are sorry, but we phased out support for this old browser version: Internet Explorer 6.
            For viewing our website, you can use one of the next modern browsers:<br />
            <br />

            Ne pare rau, dar am incetat sa mai oferim suport pentru aceasta versiune veche de browser: Internet Explorer 6.
            Pentru a putea vizualiza site-ul, puteti folosi unul dintre urmatoarele browsere moderne:
            <br />

            <a href="http://www.microsoft.com/windows/Internet-explorer/default.aspx" target="_blank"><img width="100" height="90" src="images/ie8logo.jpg" alt="Internet Explorer 8" /></a>
            <a href="http://www.mozilla.com/en-US/firefox/firefox.html" target="_blank"><img width="100" height="90" src="images/firefox-3-5-logo.jpg" alt="Firefox 3.5" /></a>
            <a href="http://www.google.com/chrome" target="_blank"><img width="100" height="90" src="images/google-chrome-logo3.png" alt="Google Chrome" /></a>
            <br />
             <div class="textimag">
                    <span style="position:relative; left:-40px">Internet Explorer 8</span>
                    <span style="position:relative; left:-18px">Mozilla Firefox 3.5</span>
                    <span style="position:relative; left:12px">Google Chrome</span>
             </div>
        </div> 

        <div class="error">! EROARE !</div>
</div> 

<div id="container">
     
</div>
</body>

In stiluri.css avem asa:

#container {
   /* stiluri pentru website-ul original  */
}
/*  alte stiluri pentru   website-ul original */

/* Not to be seen by other browser other then ie6 */
.gotobetterbrowser {
display: none;
}

In ie6.css avem asa:

body {
background-image:none;
background-color: #003399;
color: #FFFFFF;
}
.error
{
color: #FF0000;
font-weight:bold;
margin-bottom:20px;
margin-top:20px;
background-color: #000000;

}
#container {
display: none;  /* original content of the site, not to be seen by ie6 */
}
#gotobetterbrowser {
display:block;   /* to be seen by ie6 */
width:60%;
padding-top: 200px;
}
img {
margin-right:20px;
margin-top:20px;
border:2px solid #000000;
}
.mesaj {
padding:0 20px;
}
.textimag {
font-size:10px;
}

Aici aveti un print screen ce va vedea vizitatorul in ie6

De asemenea, imaginile ce le-am folosit, sunt:

O zi placuta!

flipper · 11-21-2009, 07:14 PM

interesant.. bun tutorial Smile

_catalin · 04-07-2010, 07:49 PM

Opera de ce lipseste?

casperel · 04-07-2010, 08:48 PM

Iti permiti sa faci asa ceva cand esti YouTube, dar cand esti un site micut-mediu care esti vizitat in proportie de peste 50% cu IE6... atunci te apuci sa rezolvi bug-urile.