javascript - Preventing multiple toggling at a same time -
how can prevent slidedown , slide of sub menu @ same time?my navigation has menu , 1 of menus has sub menu.when click on menu has sub menu , sub menu opens,closes 2 times , closes there 1 click.it happens in mobile devices.so take @ codes
html
<ul class="nav-menu align-right"> <li class="current"><a href="index.html#header">home</a></li> <li><a href="index.html#about-us">about us</a></li> <li> <a href="#" class="extra">extra</a> <ul> <li><a href="blog-three.html">blog grid 3</a></li> <li><a href="blog-four.html">blog grid 4</a></li> </ul> </li> <li><a href="index.html#contact">contact</a></li></li> </ul>
and js
$(window).on('load resize', function(){ if($(window).width() < 1000){ $('.nav-menu li a').click(function(e) { e.preventdefault(); $(this).next('ul').slidetoggle(200, 'easeinexpo'); $(this).parent().siblings().find('ul').slideup(200, 'easeinexpo'); }); } })
you binding events everytime window resized trigger multipe times. if chamge should work jsfiddle
$(window).on('load', function(){ $('.nav-menu li a').click(function(e) { if($(window).width() < 1000){ e.preventdefault(); $(this).next('ul').slidetoggle(200, 'easeinexpo'); $(this).parent().siblings().find('ul').slideup(200, 'easeinexpo'); } }); })
Comments
Post a Comment