19/03/2011, 18:29
|
| | Fecha de Ingreso: marzo-2011
Mensajes: 2
Antigüedad: 13 años, 8 meses Puntos: 0 | |
Problema con Menu emergente Mi problema es el siguiente: hice un menu emergente con CSS y me quedo como queria. Al menu le puse una imagen de fondo y otra diferente para cuando el mouse queda encima. Lo que yo quiero es que al posisionar el mouse sobre dicho menu y la imagen cambie se mantega esa misma imagen mientras exploro el submenu, ya que cuando saco el puntero del mouse del menu la imagen vuelve a la que le puse de fondo por defecto.
Aqui dejo el codigo CSS del menu:
.menuContainer {
background-color: #0000FF;
}
.menuContainer ul{
list-style:none;
margin:0;
padding:0;
}
ul#menuem li { /******fondo texto menu oculto**********/
float:left;
list-style: none;
background-color: none;
}
ul#menuem a { /***menu visible---imagen de fondo por defecto***/
display:block;
width: 320px;
height: 105px;
color:#FFF;
text-decoration:none;
background-image: url(images/menuem.png);
}
ul#menuem a:hover { /***imagen de fondo cuando el mouse queda encima de la imagen***/
display: block;
background-image: url(images/menuem_hover.png);
}
ul#menuem ul { /****fondo del menu oculto****/
position: absolute;
display: none;
width: 960px;
height: 30px;
background-image: url(images/Fondo_menuhover_desplegable.p…
}
ul#menuem li:hover ul {
display: block;
}
ul#menuem li:hover ul li {
margin:0;
margin-top: 3px;
}
ul#menuem li:hover ul li a { /***texto del menu oculto****/
padding-left: 10px;
padding-right: 35px;
padding-top: 2px;
width: auto;
height: 18px;
text-align: left;
color: #FFFFFF;
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 11px;
background-image: none;
margin-left: 32px;
outline: 0;
}
ul#menuem li:hover ul a:hover { /***hover del texto del menu***/
color: #00FF00;
outline: 0;
}
Y aqui dejo el codigo HTML:
<div class="menuContainer">
<ul id="menuem">
<li><a href="#"></a>
<ul>
<li><a href="#">Carmelo</a></li>
<li><a href="#">Colonia del Sacramento</a></li>
<li><a href="#">Fray Bentos</a></li>
<li><a href="#">Mercedes</a></li>
<li><a href="#">Nueva Palmira</a></li>
<li><a href="#">Paysandú</a></li>
<li><a href="#">Salto</a></li>
</ul>
</li>
</div>
Ante todo muchas gracias, y ojala puedan darme una solucion. Ya que necesito el menu para tener terminada mi web. |