jQuery Drop Menu Click not Hover -



jQuery Drop Menu Click not Hover -

i'm trying drop menu work click instead of hover cant seem work. ideas ?

// drop menu $(".navigation ul ul, .shoppingbasket ul ul").css({display: "none"}); $(".navigation ul li, .shoppingbasket ul li").hover(function(){ $(this).find('ul:first').css({visibility: "visible",display: "none"}).slidedown(400); },function(){ $(this).find('ul:first').css({visibility: "hidden"}); });

.hover() takes 2 handlers, first 1 executed when mouse enters, sec executed when mouse leaves. reason, swapping .hover() .click() not work, since .click() takes 1 handler executes when click. however, .toggle() can used bind multiple handlers executed on alternate clicks.

$(".navigation ul ul, .shoppingbasket ul ul").css({display: "none"}); $(".navigation ul li, .shoppingbasket ul li").toggle(function(){ $(this).find('ul:first').css({visibility: "visible",display: "none"}).slidedown(400); },function(){ $(this).find('ul:first').css({visibility: "hidden"}); });

try out here.

also, it's hard tell w/o html, .slidedown() create element visible, , may want utilize .slideup(). might want seek this:

$(".navigation ul ul, .shoppingbasket ul ul").css({display: "none"}); $(".navigation ul li, .shoppingbasket ul li").toggle(function(){ $(this).find('ul:first').slidedown(400); },function(){ $(this).find('ul:first').slideup(400); });

try out here.

in fact, why not utilize .slidetoggle(), makes things more compact , allows utilize .click()?

$(".navigation ul ul, .shoppingbasket ul ul").css({display: "none"}); $(".navigation ul li, .shoppingbasket ul li").click(function(){ $(this).find('ul:first').slidetoggle(400); });

try out here.

jquery

Comments

Popular posts from this blog

iphone - Dismissing a UIAlertView -

intellij idea - Update external libraries with intelij and java -

javascript - send data from a new window to previous window in php -