Ver Mensaje Individual
  #2 (permalink)  
Antiguo 12/09/2005, 23:45
Avatar de KnowDemon
KnowDemon
 
Fecha de Ingreso: julio-2004
Ubicación: Ciudad de México
Mensajes: 544
Antigüedad: 19 años, 9 meses
Puntos: 2
¡¡Puedes crear rollovers de formas mucho más simples con CSS!!

Como IE solo reconoce el :hover en los "anchors", nos valdremos de ellos para hacer el rollover. Veamos:

Supon que tu rollover es de 200x100 pixeles. Crea un elemento "a" con la propiedad display: block; dale las dimensiones mencionadas y asigna una imagen de fondo del doble de ancho o alto. De esa forma solo verás una mitad de la imagen. He aquí el secreto: cuando el raton pase sobre él, solo desplaza el fondo de forma que se vea la otra mitad. Una representará uno de los estados de tu rollover, y la otra... pues el otro.

¡¡Voilá!! Un rollover con precarga hecho en CSS:

a.rollover{
display: block;
width: 200px;
height: 100px;
background: url(imagen.png) 0 0; /*Imagen de 200x200*/
}

a.rollover:hover{
background: url(imagen.png) 0 -100px;
}
__________________
Mi pequeño espacio en la web: VisiónE
"El cosmos es todo lo que es, todo lo que fue, y todo lo que será alguna vez."