jquery - .on('mouseenter', function(){... not working -


i have following event:

$('.swiper-slide-active').on('mouseenter', function(){             $(this).find('.overlay').addclass('show');             $(this).find('.hotspot').addclass('show');      }) 

problem class .swiper-slide-active added when slider ready, thought .on had replaced .live event. nothing happens when rollover element has class. there way wait until class added?

the slider initiated this:

 var myswiper = new swiper('.swiper-container',{             ....           }) 

use delegated on event dynamic elements:

$(document).on('mouseenter', '.swiper-slide-active', function(){         $(this).find('.overlay').addclass('show');         $(this).find('.hotspot').addclass('show');  }) 

it works listening event (in case mouseenter) bubbled non-changing parent (document default if have nothing closer changing elements hang off), then applies jquery filter, then runs supplied function against matching elements that caused event

if case hang .swiper-container efficiency:

e.g.

$('.swiper-container').on('mouseenter', '.swiper-slide-active', function(){         $(this).find('.overlay').addclass('show');         $(this).find('.hotspot').addclass('show');  }) 

*note: avoid using "body" hang delegated events from, instead of document, body has style-related problems delegated events.


Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

Python ctypes access violation with const pointer arguments -