![Antiguo](http://static.forosdelweb.com/fdwtheme/images/statusicon/post_old.gif)
12/09/2005, 23:45
|
![Avatar de KnowDemon](http://static.forosdelweb.com/customavatars/avatar69166_1.gif) | | | Fecha de Ingreso: julio-2004 Ubicación: Ciudad de México
Mensajes: 544
Antigüedad: 20 años, 6 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." |