Hola listeros y listeras.
Estoy intentando un menu con rollover, por supuesto utilizando CSS,
solamente con una imagen por cada entrada de menu que "muevo" para
conseguir el efecto. Lo he utilizado verticalmente y ahora me hace falta
en horizontal, pero claro, como los elementos tienen un display:block se
producen saltos de linea y no se me ocurre como ponerlos inline. ¿Se os
ocurre como hacer este menu en horizontal?
El codigo es muy sencillo, falta desarrollar una imagen para cada
elemento, pero el funcionamiento puede entenderse:
HTML:
<div id="menu">
<ul id="menulista">
<li><a href=""> </a></li>
<li><a href=""> </a></li>
<li><a href=""><span>Texto del enlace</span></a></li>
<li><a href=""><span>Texto</span></a></li>
<li><a href=""><span>Texto</span></a></li>
</ul>
</div>
CSS:
#menu { margin: auto;
background-color: #dbd855;
}
#menu li {
list-style-type: none;
}
#menu a {
display:block;
width:153px;
height: 32px;
background: url("imagenes/participa-rollover.gif");
}
#menu a:hover {
background-position: -153px 0;
}
#menu a:active {
background-position: -306px 0;
}
#menu li a span {
display:none; //Oculto el texto.
}
Podeis verlo corriendo en www.onbox.com/demo/rollover.html
http://www.onbox.com/demo/rollover.html
Muchas gracias por vuestro tiempo.
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
