CODEWITHSUNDEEP
jquery
s15199d
s15199d

Reputation: 7707

JQUERY if not hover

Mouseenter of DIV A sets DIV B to show(). What I want is on mouseleave of DIV A if they are not hovering over DIV B, hide DIV B. But, on mouseleave of DIV A if they are hovering over DIV B keep showing DIV B.

$('#DIVA').mouseenter(function() {
        $('#DIVB').show();  
    }).mouseleave(function() {      
        //if DIVB not hovering
            $('#DIVB').hide();
        //end if
    });

Upvotes: 15

Views: 50284

Answers (2)

Mark
Mark

Reputation: 10206

It could be as simple as just using hover.

http://jsbin.com/ojipu/2

...but that depends on what the markup looks like.

Upvotes: 7

Sam
Sam

Reputation: 4487

Could you add a class to #DIVB on hover then check for it on mouseleave for #DIVA?

$('#DIVB').hover(function(){
    $(this).addClass('active');
}, function(){
    $(this).removeClass('active');
})

$('#DIVA').mouseenter(function() {
    $('#DIVB').show();  
}).mouseleave(function() {      
    if(!$('#DIVB').hasClass('active')){
        $('#DIVB').hide();
    }
});

Upvotes: 16

Related Questions