javascript - 在具有 stopPropagation 和/或 preventDefault 的元素上应用 jQuery

Question

元素链接:

http://50.87.144.37/~projtest/wp/ziva/?page_id=7

我在页面上应用了owl-carousel来展示产品。布局是这样的:

当用户将鼠标悬停在产品上时，白色的叠加层会滑落，布局如下:

我正在应用以下 JS:

$('.owl-item .item').hover(function(){

    $(this).find('.itemHover').animate({
        top:0,
        opacity:1
        }, 700)
    setTimeout(function () {    

    $(this).find('.dressName, .dressLinks').animate({
        top:0,
        opacity:1
        },500)
    }, 501);

})

但它不起作用。这很可能是因为 owl-carousel 插件中的多个 stopPropagation 和/或 preventDefault 函数。有什么方法可以在产品上应用我想要的 jQuery 吗？

链接到插件的js:

http://50.87.144.37/~projtest/wp/ziva/wp-content/themes/ziva/js/owl.carousel.js

Answer 1

尝试使用 on 进行委托(delegate)，我的意思是代码运行时元素还没有准备好

$(document).on('mouseenter','.owl-item .item',function(){

});

$(document).on('mouseleave','.owl-item .item',function(){

});