首页 > 解决方案 > 猫头鹰轮播仅在包含部分焦点时自动播放

问题描述

我在 JSP 的 section 标记中包含了 owl carousel 。我的要求是猫头鹰轮播只有在用户滚动到该部分时才会自动播放。当用户向下滚动到另一个部分时它应该暂停,并在用户向上滚动到包含的部分时继续自动播放。尝试了几种方法,但都不起作用。如果有人可以帮助我,那就太好了。

标签: javascriptangularjscssowl-carouselautoplay

解决方案


通常这件事不能通过向下滚动来实现,但是对于这件事,您可以在轮播可见时添加自动播放,但它仅适用于鼠标悬停

var owl = $('.owl-carousel');
owl.owlCarousel({
    items: 1,
    loop: true
});

$('.section').on("mouseenter", function(e) {
    owl.trigger('owl.play', 2000);
})

推荐阅读