简体   繁体   English

猫头鹰轮播问题(自动播放+响应式)

[英]Owl Carousel problems (autoplay + responsive)

I'm using owlcarousel on my website, but I have a few problems. 我在网站上使用猫头鹰传送带,但是有一些问题。 For one, the responsiveness isn't working properly. 一方面,响应能力不正常。 And for two, the carousel won't autoplay. 对于两个人来说,轮播不会自动播放。 You can see the issue here . 您可以在这里看到问题。

Here's my code: 这是我的代码:

$(".owl-carousel").owlCarousel({
    items: 1,
    loop: true,
    center: true,
    dots: true,
    autoplay: true,
    autoplayTimeout: 5000,
    autoplaySpeed: 5000,
    responsiveClass: true,
    responsive:{
      0:{
          items: 1 
      },
      600:{
          items: 1
      },
      1200:{
          items: 1
      }
  }
});

Update: I managed to fix the responsive issues by adding: 更新:通过添加以下内容,我设法解决了响应问题:

itemsDesktop: [1200, 1],
itemsTablet: [980, 1],
itemsMobile: [700, 1]

to the options. 选项。

Still, the autoplay isn't working. 尽管如此,自动播放仍无法正常工作。

here is my solution : 这是我的解决方案:

      $('.owl-carousel').owlCarousel({
            item:3,
            singleItem: true,
            autoplay: true,
            autoplayTimeout: 5000,
            loop: true,
            nav: true,
            responsiveClass: true,
            responsive:{
                0:{
                    items: 1,
                    dots: false
                },
                600:{
                    items: 2,
                    dots: false
                },
                1200:{
                    items: 3
                }
            }
        });

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM