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
Post a Comment