Jquery menu syntax not working to old -
Jquery menu syntax not working to old -
hi utilize code of jquery menus, problem im using newer version (i think) of jquery because dock menu mac style client ask,.. menu working , slidedown function dont remain open, menu not working..
i used utilize jquery..
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
whit code:
<script type="text/javascript"> $(document).ready(function(){ $("ul.submenu").parent().append("<span></span>"); $("ul.menu li span").hover(function() { //al hacer click se ejecuta... //con este codigo aplicamos el movimiento de arriva y abajo para el submenu $(this).parent().find("ul.submenu").slidedown('fast').show(); //menu desplegable al hacer click $(this).parent().hover(function() { }, function(){ $(this).parent().find("ul.submenu").slideup('slow'); //ocultamos el submenu cuando el raton sale fuera del submenu }); }).hover(function() { $(this).addclass("subhover"); //agregamos la clase subhover }, function(){ //cunado sale el cursor, sacamos la clase $(this).removeclass("subhover"); }); }); </script>
this code remains same, im using on header now..
<script src="js/jquery.tools.min.js"></script> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/interface.js"></script>
the question after how can rewrite lines create menu works...
here working http://www.dreaminmedia.com/imdr/quienessomos.php
here html
<div id="menuwrap"> <ul class="menu"> <li><a href="#">inicio</a></li> <li> <a href="#">tutoriales</a> <ul class="submenu"> <li><a href="#">css</a></li> <li><a href="#">javascript</a></li> <li><a href="#">jquery</a></li> <li><a href="#">html</a></li> <li><a href="#">php</a></li> </ul> </li> <li> <a href="#">códigos</a> <ul class="submenu"> <li><a href="#">reloj en flash</a></li> <li><a href="#">fecha con js</a></li> <li><a href="#">xml y as</a></li> <li><a href="#">rss y php</a></li> <li><a href="#">asp excel</a></li> <li><a href="#">php excel</a></li> </ul> </li> <li><a href="#">sobre nosotros</a></li> <li><a href="#">politica</a></li> <li><a href="#">contactanos</a></li> </ul> </div>
what need event delegation if using latest jquery:
change line:
$("ul.menu li span").hover(function() { //al hacer click se ejecuta...
to this:
$("#menuwrap").on('hover', 'ul.menu li span', function() { //al hacer click se ejecuta...
@ latest comment:
$("#menuwrap").on('hover', 'ul.menu li span', function () { $(this).addclass("subhover"); }, function () { $(this).removeclass("subhover"); }); $("#menuwrap ul.menu li").hover(function () { $("> ul.submenu", this).stop().slidedown('fast').show(); }, function () { $("> ul.submenu", this).stop().slideup('slow'); });
jquery syntax menu slidedown
Comments
Post a Comment