CODEWITHSUNDEEP
javascriptjqueryevents
user828591
user828591

Reputation: 1262

jQuery Events get skipped

I built a slideshow-menu (using Slide JS - http://www.slidesjs.com/ ) and added a hover-event, so images will already switch when moving the mouse over the menu point. Additionally, when moving out of the whole block, there's a mouseleave event, which sets the image and menu point back to the first one. Now when I quickly switch between menu points (hover event) and then leave the whole block (mouseleave), it usually skips the mouseleave event (- or it never reaches it because the hover events (including a fade effect) take up too long).

Is there a way to thoroughly work off each event (or at least the last one in a row - e.g. mouseleave or last hover)?

Maybe an image of the website layout helps? enter image description here

Red: Hover-Event (changes green content)

Blue: Mouseleave-Event (green goes back to default)

Upvotes: 0

Views: 106

Answers (1)

kayen
kayen

Reputation: 4868

If the fade effect is the culprit, then try adding a stop(true, true) function before your fade effect. 

$(slideshow-menu-selector).on('mouseleave', function(){
    // Reset code here
    $(element-selector).stop(true, true).fadeOut();
})

This is just a sample code, based on your question. If you can put up a Fiddle, it would help a lot!

Upvotes: 1

Related Questions