CODEWITHSUNDEEP
javascriptjquery
Jason Biondo
Jason Biondo

Reputation: 834

Stop jQuery Mouseleave Event When Entering Another Specific Element

I need to know how I can stop my mouseleave event from occuring when I slide my mouse over to a different element (link). How can I setup a condition that says to only do the mouseleave animation if I have not entered a specific element?

$(activity_link).mouseenter(function() {
    $(this).siblings(".delete_place").animate({ 
                                               "left" : "-28px"
                                              }, 300);     
}).mouseleave(function() {
     $(this).siblings(".delete_place").animate({
                                                "left" : 0
                                               }, 300);
});

Upvotes: 5

Views: 3323

Answers (2)

A. Wolff
A. Wolff

Reputation: 74420

Use of event relatedTarget:

$(activity_link).mouseenter(function () {
    $(this).siblings(".delete_place").animate({
        "left": "-28px"
    }, 300);
}).mouseleave(function (e) {
    if (e.relatedTarget != myElem) { //where myElem is a HTML element
        $(this).siblings(".delete_place").animate({
            "left": 0
        }, 300);
    }
});

Upvotes: 4

intuitivepixel
intuitivepixel

Reputation: 23322

you could stop the event and prevent it from bubbling/firing:

...
}).mouseleave(function(event) {
    if(mycondition) {
        $(this).siblings(".delete_place").animate({"left" : 0}, 300);
    } else {
        event.preventDefault();
    }
    ...

Upvotes: -1

Related Questions