Javascript 当区段可见时,owl转盘2启动自动播放
我正在做一个项目,我想启动自动运行功能的猫头鹰转盘2时,我将在该转盘部分。通常自动运行不会运行,当我向下滚动并将鼠标悬停在该区域上时,自动播放将启动。参见代码--- HTML:Javascript 当区段可见时,owl转盘2启动自动播放,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我正在做一个项目,我想启动自动运行功能的猫头鹰转盘2时,我将在该转盘部分。通常自动运行不会运行,当我向下滚动并将鼠标悬停在该区域上时,自动播放将启动。参见代码--- HTML: <div class="header"> <h1>this is heading section</h1> </div> <div class="section"> <h1>This is section</h1>
<div class="header">
<h1>this is heading section</h1>
</div>
<div class="section">
<h1>This is section</h1>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries</p>
<div class="owl-carousel">
<div><img src="http://placehold.it/550x450"/></div>
<div><img src="http://placehold.it/550x450"/></div>
<div><img src="http://placehold.it/550x450"/></div>
<div><img src="http://placehold.it/550x450"/></div>
<div><img src="http://placehold.it/550x450"/></div>
<div><img src="http://placehold.it/550x450"/></div>
<div><img src="http://placehold.it/550x450"/></div>
<div><img src="http://placehold.it/550x450"/></div>
<div><img src="http://placehold.it/550x450"/></div>
</div>
</div>
var owl = $('.owl-carousel');
owl.owlCarousel({
items: 1,
center: false,
loop: true,
autoplay: false,
autoplayTimeout: 1000,
smartSpeed:1000,
autoplayHoverPause: true
});
$('.section').mouseover(function(e) {
owl.trigger('play.owl.autoplay', [1000]);
})
请看,我使用mouseover函数来激活该函数,我的意思是当我将鼠标移到需要运行自动播放的部分,但它不工作时。。。请帮帮我
因此,您需要以下内容
var owl = $('.owl-carousel');
owl.owlCarousel({
items: 1,
loop: true
});
$('.section').on("mouseenter", function(e) {
owl.trigger('owl.play', 1000);
//Not owl.trigger('play.owl.autoplay', [1000]);
})
--
请看一看,因为您要么使用了旧版本,要么使用了不存在的参数。首先,旋转木马本身没有构建!嗨,@LShetty没有机会这么做吗?对于carousel v.2,它是
自动播放.play.owl
!