click function triggering function before event finishes

Question

I've built a dropdown menu that uses a slideUp event if the menu itself or anywhere in the body is clicked:

$('html, .currentPage').click(function() { 
    $('.currentMenu').slideUp('fast', function() { myFunction(); });
});

I also have a function inside the slideUp event callback.

However, my problem is that the function is being called on html or .currentPage click whether the slideUp event has occurred or not.

How can I make it so the function(); ONLY happens if the slideUp event runs?

Meligy · Accepted Answer · 2012-03-02 00:22:55Z

1

$('html, .currentPage').click(function() { 
    var $currentMenu = $('.currentMenu');

    if($currentMenu.is(':visible')) { 
        $currentMenu.slideUp('fast', function() { myFunction(); });
    }
});

even more

$('html, .currentPage').click(function() { 
    var $currentMenu = $('.currentMenu');

    if($currentMenu.is(':visible')) { 
        $currentMenu.slideUp('fast', myFunction);
    }
});

You can also optionally use $currentMenu.css('display') != 'none' instead of $currentMenu.is(':visible').

The options are suggested based on the actual behaviour of slideUp(), described in the official documentation at http://api.jquery.com/slideUp/.

edited Mar 2, 2012 at 0:22

answered Mar 2, 2012 at 0:13

Meligy

36.7k11 gold badges90 silver badges114 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ken Wheeler · Accepted Answer · 2012-03-02 00:12:03Z

1

$('.currentMenu').slideToggle('fast', function() { myFunction(); });

answered Mar 2, 2012 at 0:12

Ken Wheeler

1,95813 silver badges12 bronze badges

Comments

elclanrs · Accepted Answer · 2012-03-02 00:12:14Z

0

You could add class open to your menu and slideUp() if hasClass('open'):

if ( $menu.hasClass('open') ) {
    $menu.slideUp('fast', function(){ });
    ...
}

answered Mar 2, 2012 at 0:12

elclanrs

94.2k21 gold badges137 silver badges171 bronze badges

3 Comments

bhamlin Over a year ago

or just $('.currentMenu').is(':visible')

elclanrs Over a year ago

Yeah, that would work too depending on how the menu is styled.

Meligy Over a year ago

Not related to how the menu is styled. slideUp() hides the menu, so, :is('visible') is reliable if your hiding logic is slideUp(), which is defined already in the question.

Collectives™ on Stack Overflow

click function triggering function before event finishes

3 Answers 3

Comments

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related