Non esiste web designer che non sobbalzi sulla sedia nel sentire le parole Internet Explorer 6. Nonostante Google abbia deciso di interrompere gradualmente il supporto a questa versione, una buona fetta di mercato (circa il 20%) continua ad utilizzarlo.
Un incubo vero e proprio per noi web designer, costretti a compiere salti mortali per ottenere una corretta visualizzazione dei contenuti.
Dan Edwards giunge in nostro soccorso sviluppando ie7.js, una libreria Javascript che correggere i comportamenti di IE6 avvicinandoli a quelli della versione successiva, la 7. Tuttavia anche IE7 presenta delle lacune e quindi, all'interno dello stesso pacchetto, troviamo anche ie8.js.
Non contento, ha sviluppato anche ie9.js, javascript che corregge la visualizzazione delle pagine HTML in modo da avvicinarla il più possibile a quella che eseguirebbe un browser standard compliant.
È possibile effettuare il download degli script direttamente dal sito del progetto, ospitato da Google Code.
http://code.google.com/p/ie7-js/
Nella sezione demo possiamo anche verificare su quali CSS Property i javascript vanno ad agire.
Facciamo un esempio.
Senza l’intervento dello script di Dan Edwards, IE6 tende ad ignorare la property min-height di #box.
|
<style type="text/css">
#box {
min-height: 300px;
width:600px;
background-color:#F3F8DD;
padding:15px;
}
</style>
</head>
<body>
<h2>Esempio property Min-height</h2>
<div id="box">
<p>"Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor incididunt
ut labore et dolore magna aliqua. Ut enim ad minim
veniam, quis nostrud exercitation ullamco laboris
nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate velit
esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident,
sunt in culpa qui officia deserunt mollit anim
id est laborum."
</p>
</div>
</body>
|
Con ie7.js finalmente non dobbiamo più utilizzare workaround per ottenere il giusto comportamento.
<style type="text/css">
#box {
min-height: 300px;
width:600px;
background-color:#F3F8DD;
padding:15px;
}
</style>
</head>
<body>
<script src="js/IE7.js"></script>
<h2>Esempio property Min-height</h2>
<div id="box">
<p>"Lorem ipsum dolor sit amet,
consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim venquis nostrud exercitation
ullamco laboris nisi utaliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum dolore eu fugiat
nulla paria. Sint occaecat cupidatat non proident,
sunt in culpa qui officia deserunt mollit anim
id est laborum."
</p>
</div>
</body>
Grazie Dan Edwards! Ci hai semplificato la vita! :-)
bloggers 
Marco Napolitano 
Jader Jed Francia 
Paolo Gambetti 
Katia Pazzi 
Ezio Lombardi 
Chiara Mambretti 
Serena Traversi 
Francesco Falanga 
Antonio Musarra 
Simone Celli Marchi 
