Outbook

HTML+CSS+JS, Accesibilidad, PHP y más

Inicio que contiene a Desarrollo web que contiene a Javascript que contiene a Javascript: simular hover en Internet Explorer 6 con Prototype

Datos de búsqueda

Javascript: simular hover en Internet Explorer 6 con Prototype

Se trata de un sencillo script que nos permitirá evitar el problema de Internet Explorer 6 con la pseudo-clase :hover. Dicha pseudo-clase se puede aplicar a cualquier elemento, para que al pasar el puntero por encima puedan cambiarse los estilos, pero Internet Explorer 6, en su línea habitual, solo lo acepta en elementos de enlace.

Este sería el script, preparado para hacer el hover sobre cualquier elemento con la clase hacer-hover:

document.observe("dom:loaded", function() {
 if(/MSIE 6.0/i.test(navigator.userAgent)) {
  var hover1 = new HoverIE6();
   hover1.op = {
    selector: '.hacer-hover',
    claseHover: 'hover'
   }
   hover1.inicia();
 }
}); 

function HoverIE6 () {
 this.op = {
  selector: '',
  claseHover: ''
 }
 
 this.inicia = function () {
  var that = this;
  
  $$(that.op.selector).each(function (el) {
   el.observe('mouseover',function () {
    el.addClassName(that.op.claseHover);
   });
   
   el.observe('mouseout',function () {
    el.removeClassName(that.op.claseHover);
   });
  });
 }
}

El script añade la clase hover a los elementos sobre los que se quiere el efecto cuando pasa el puntero por encima.

Ver ejemplo funcionando.

Comentarios del artículo

Los comentarios están cerrados.

Si el comentario no guarda relación con el tema del artículo o los comentarios previos, si la redacción del mismo es ilegible (estilo HOYGAN), o si contiene insultos u otros términos ofensivos, será borrado de inmediato. No se garantiza ningún soporte a los ejemplos de desarrollo web presentados en este sitio.

Todavía no hay comentarios.

Los comentarios están cerrados.

Información del sitio