微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

猫头鹰轮播autoplayTimeout不起作用

如何解决猫头鹰轮播autoplayTimeout不起作用

我的猫头鹰轮播中有以下设置

$(".slider").owlCarousel({
        items: 1,loop: true,nav: true,margin: 0,dots: true,// animateIn: 'fadeIn',// animateOut: 'fadeOut',autoplay: true,lazyLoad: true,smartSpeed: 1000,autoplayTimeout: 7000
        //autoplaySpeed: true,});

我认为是正确的,但是autoplayTimeout无法正常工作。为什么?猫头鹰传送带2,ver。 2.3.4。

解决方法

就像我告诉你的一样工作正常,这里有一个设置示例:

var owl = $('.owl-carousel');
owl.owlCarousel({
    items: 1,loop: true,nav: true,margin: 0,dots: true,// animateIn: 'fadeIn',// animateOut: 'fadeOut',autoplay: true,lazyLoad: true,smartSpeed: 1000,autoplayTimeout: 7000
        //autoplaySpeed: true,});
.item1
{
height:200px;
background-color:red;
}
.item2
{
height:200px;
background-color:blue;
}
.item3
{
height:200px;
background-color:magenta;
}
.item4
{
height:200px;
background-color:green;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.css">

<div class="owl-carousel owl-theme">
            <div class="item1">
              <h4>1</h4>
            </div>
            <div class="item2">
              <h4>2</h4>
            </div>
            <div class="item3">
              <h4>3</h4>
            </div>
            <div class="item4">
              <h4>4</h4>
            </div>
            
          </div>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。