猫头鹰旋转木马问题（自动播放+响应）

我在我的网站上使用猫头鹰，但我有一些问题。首先，响应性不能正常工作。而对于两人来说，旋转木马不会自动播放。您可以看到问题here。猫头鹰旋转木马问题（自动播放+响应）

这里是我的代码：

$(".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 
     } 
    } 
});

更新：我设法通过向固定的响应问题：

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

的选项。

不过，自动播放功能无法正常工作。

来源

2017-02-19 Pim

'autoplaySpeed：5000'将使你的滑块速度很慢，可以考虑当你正在使用相当大尺寸图像删除此，如果你还正在显示一个项目你不需要“响应式”对象。您的猫头鹰轮播代码没有任何问题，可能是其他问题导致您面临的问题。 – azs06

您看到屏幕变小时会发生什么？这就是为什么我添加了响应对象。似乎不考虑响应选项。 – Pim

这里是我的解决方案：

 $('.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 
       } 
      } 
     });

来源

2017-11-09 10:52:27

猫头鹰旋转木马问题（自动播放+响应）

回答

相关问题