De todos es conocido el problema de emplear la pseudo-clase :hover con Internet Explorer 6. Este funciona solamente con los hipervínculos (<a></a>) dejando fuera al resto de elementos.

Con la ayuda de jQuery, podemos solventar de manera fácil este problema añadiendo unas lineas al inicio del script, y teniendo en cuenta una regla en el CSS que contenga los estilos.

Por ejemplo, teniendo el siguiente CSS:
#menu li:hover {
text-decoration:underline:
}

Habría que modificarlo tal que:
#menu li:hover, #menu li.hover {
text-decoration:underline:
}

De manera que podamos acceder a dicho estilo mediante una clase.

Y ahora, solo quedaría realizar un script que añada la clase o la elimine según el evento llamado. Para ello emplearemos la función hover(mouseOver, mouseOut) que nos facilita jQuery.
$(document).ready( function() {
if ($.browser.msie) $("*").hover( function() { $(this).addClass("hover"); }, function() { $(this).removeClass("hover"); } );
});

Y a funcionar :D

Otras entradas de interés

No hay comentarios»

RSS feed de los comentarios. TrackBack URL

Deja un comentario

Please copy the string DBAXbp to the field below: