<html>
<head>
<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
//<[[CDATA[
$(document).ready(function(){
//añadir funcion para la clase submenu al clickear
$(".submenu").click(function(){
// slow, normal, fast o el tiempo en milisegundos
$(this).next().slideToggle("slow");
});
//Para que aparezca escondido desde un principio
$(".submenu").next().hide();
//Cambiar el href para que no navegue a la página
$(".submenu").attr("href","javascript:void(0);");
});
//]]>
</script>
</head>
<body>
<ul>
<li><a class="submenu" href="/seccion1/">Seccion 1</a>
<ul style="background-color: #888FFF;">
<li><a href="#">enlace 1</a></li>
<li><a href="#">enlace 2</a></li>
<li><a href="#">enlace 3</a></li>
</ul>
</li>
<li><a class="submenu" href="/seccion2/">Seccion 2</a>
<ul style="background-color: #888FFF;">
<li><a href="#">enlace 1</a></li>
<li><a href="#">enlace 2</a></li>
<li><a href="#">enlace 3</a></li>
</ul>
</li>
</ul>
</body>
</html>
No hay comentarios:
Publicar un comentario