http://carlaleoncalzado.com/
Si se ubican en el menú COLECCIONES
Podran notar que se abre un menu deslizable como un SUBMENU, bueno antes debo mencionar que este menu es un plugin Jquery : Lavalamp sacado de esta página:
http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/
Ahora este menu no tiene implementado submenus a mi parecer asi que decidi ponerle uno de la siguiente forma.. añadiendo un div en posicion absoluta de esta manera
Código HTML :
<ul class="lavaLampNoImage" id="1">
<li>
<a href="index.php" onclick="abrir('index.php');return false">INICIO</a>
</li>
<li id="menu">
<a href="coleccion.php" onclick="abrir('coleccion.php');return false">COLECCIONES</a>
</li>
<div id="sub-menu">
<a href="#">Otoño - Invierno 2012</a><br>
<a href="#">Primavera - Verano 2013</a><br>
</div>
<li>
<a href="taller.php" onclick="abrir('taller.php');return false">TALLER</a>
</li>
<li>
<a href="pedidos.php" onclick="abrir('#');return false">PEDIDOS</a>
</li>
<li>
<a href="contactanos.php" onclick="abrir('contactanos.php');return false">CONTACTO</a>
</li>
</ul>
Código CSS :
#sub-menu {
position: absolute;
top: 40px;
left: 75px;
width: 250px;
height: 50px;
z-index: 30;
color: white;
background-color: #333;
padding: 5px;
padding-left: 15px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
Y aqui esta el Javascript k me permite ocultar o mostrar ese div SUB-MENU
Código Javascript :
<script type="text/javascript">
$(document).ready(function(){
$('#sub-menu').hide();
$("#menu").mouseover(function(){
$("#sub-menu").show(50);
});
$("#menu").mouseout(function(){
$("#sub-menu").hide();
});
$("#sub-menu").mouseover(function(){
$("#sub-menu").show();
});
$("#sub-menu").mouseout(function(){
$("#sub-menu").hide();
});
});
</script>
Ahora este me funciona en el index.php pero no en la pagina coleccion.php, lo he revisado y revisado pero no encuentro el error. Pueden ver el codigo en chrome --> inspeccionando elemento o ver codigo fuente.. porfavor ayudemme.
