2017-02-19 106 views
0

我在我的網站上使用貓頭鷹,但我有一些問題。首先,響應性不能正常工作。而對於兩人來說,旋轉木馬不會自動播放。您可以看到問題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] 

的選項。

不過,自動播放功能無法正常工作。

+0

'autoplaySpeed:5000'將使你的滑塊速度很慢,可以考慮當你正在使用相當大尺寸圖像刪除此,如果你還正在顯示一個項目你不需要「響應式」對象。您的貓頭鷹輪播代碼沒有任何問題,可能是其他問題導致您面臨的問題。 – azs06

+0

您看到屏幕變小時會發生什麼?這就是爲什麼我添加了響應對象。似乎不考慮響應選項。 – Pim

回答

0

這裏是我的解決方案:

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