jquery - Propagation issue with sub-menus -
on my page (pass = "shooga1"), clicking on collections (left sidebar) displays sub-menu containing 1 item named "collection #1". clicking on items display yet sub-menu, items reason cannot clicked. why not?
here's code:
$( 'li.item_collection' ).toggle(function() { $( 'li.item_collection > .sub-menu' ).slidedown( { duration: 200, easing: 'easeinoutexpo' } ); }, function() { $( 'li.item_collection > .sub-menu' ).slideup(100); }); $( 'li.item_collection > .sub-menu' ).click(function(e) { e.stoppropagation(); }); $( 'li.item_collection > .sub-menu > li' ).toggle(function() { $(this).children('ul').slidedown( { duration: 200, easing: 'easeinoutexpo' } ); }, function() { $(this).children('ul').slideup(100); }); $( 'li.item_collection > .sub-menu > .sub-menu > li' ).click(function(e) { e.stoppropagation(); });
your toggles bit out of place...they should inside click
handlers. can simplify code ton though 1 handler , simple child menu check:
$(".menu li a").click(function(e) { e.preventdefault(); //dont goto link right away //check existence of ul @ first index var submenu = $(this).parent("li").find("ul:eq(0)"); if (submenu.length) { //if child menu, toggle submenu.slidetoggle(); } else { //no child menu, head link! location.href = this.href; } });
Comments
Post a Comment