IE8.js: Resolviendo incompatibilidades de IE

Vaya, leí entusiasmada hasta que llegué al final. Suena a chiste eso de "no están implementados en Internet Explorer" es como decir que algo está riquísimo pero no podemos comerlo porque nos va a sentar mal

Pués sí. Gem@ tiene razón en sentir eso luego de leer que algunas de las alternativas más avanzadas del CSS aún no han sido incorporadas a Internet Explorer, aunque algunas de ellas ya funcionan en la versión más reciente del navegador IE8 que puede ser descargada sin restricciones desde la página de Microsoft.

Sin embargo hace tiempo, había comentado en una entrada, que en Google Codes podíamos encontrar la solución y es hora de volver sobre ese tema.

Dean Edwards es el creador de una serie de scripts muy pequeños que podemos cargar directamente sin necesidad de alojarlos nosotros y que permiten solucionar esas limitaciones, agregando a IE, una serie de funciones que no posee. Hay dos versiones IE7.js e IE8.js que contiene al anterior y que es el que conviene usar.

¿Qué cosas resuelve?

Permite el uso de selectores CSS:
parent>child adjacent + sibling adjacent ~ sibling .multiple.classes :hover :first-child [attr] [attr="value"] [attr~="value"] [attr|="value"] [attr^="value"] [attr$="value"] [attr*="value"] ::after ::before :active :focus :checked :contains() :disabled :empty :enabled :indeterminate :lang() :last-child :not() :nth-child() :nth-last-child() :only-child :target

Agrega y corrige la forma de interpretar ciertas propiedades CSS:
background-attachment background-image bottom cursor display font-size margin max-height max-width min-height min-width overflow position right border-spacing (para tablas) box-sizing content soporta attr() y url() opacity property: inherit

Agrega y corrige la forma de interpretar ciertos elementos HTML:
abbr img label button[type=submit] form object

Soluciona además los problemas de márgenes dobles y otros detalles específicios aunque para esto último hay una librería extra llamada ie7-squish.js.

También corrige el uso de imágenes PNGs transparentes pero, con una limitación, lo hace sólo si la imagen tiene este tipo de nombre: *-trans.png

No lo hará en el 100% de los casos pero, si miran la página de demos, verán que lo hace bastante bien

¿Cómo lo usamos, simplemente agregamos esto antes de </head>:
<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js" type="text/javascript"></script>
<![endif]-->

REFERENCIAS:code.google.com

0 comentarios:

Publicar un comentario