貓頭鷹旋轉木馬addItem問題

我目前使用貓頭鷹旋轉木馬和通過AJAX填充。當我使用addItem方法時，貓頭鷹旋轉木馬會轉到第一個項目，但我希望旋轉木馬轉到添加的項目。所以爲了讓我使用跳轉到，但這裏的問題是旋轉木馬先去，然後跳轉到添加項目。我只需要旋轉木馬去最新的項目。貓頭鷹旋轉木馬addItem問題

來源

2014-11-14 lcshobin

沒有解決這一然而，我相信 - 看https://github.com/OwlFonk/OwlCarousel/issues/378 – Olaf

好問題。我也有完全一樣的問題。我能做的最好的辦法就是做owl.goTo（slideIWant），但是這樣可以非常快速地將所有圖像滾動到slideIWant，這非常不理想，並且可能會讓用戶感到不適。 –

我有同樣的問題，所以我用lazyLoad：真實，
我解決它使用下面這段代碼：

var itemBlock ='<div> slider item </div>'; \\ add your code in ajax 

$('#owl-slider').html(itemBlock).trigger('create'); 

$("#owl-slider").owlCarousel({ 
     // Most important owl features 
     ltr:true, 
     items : 5, 
     itemsCustom : false, 
     itemsDesktop : [1199,8], 
     itemsDesktopSmall : [980,5], 
     itemsTablet: [768,4], 
     itemsTabletSmall: false, 
     itemsMobile : [479,2], 
     singleItem : false, 
     itemsScaleUp : false, 

     //Basic Speeds 
     slideSpeed : 200, 
     paginationSpeed : 800, 
     rewindSpeed : 1000, 

     //Autoplay 
     autoPlay : false, 
     stopOnHover : false, 

     // Navigation 
     navigation : false, 
     navigationText : ["prev","next"], 
     rewindNav : true, 
     scrollPerPage : false, 

     //Pagination 
     pagination : false, 
     paginationNumbers: false, 

     // Responsive 
     responsive: true, 
     responsiveRefreshRate : 200, 
     responsiveBaseWidth: window, 

     // CSS Styles 
     baseClass : "owl-carousel", 
     theme : "owl-theme", 

     //Lazy load 
     lazyLoad : true, 
     lazyFollow : true, 
     lazyEffect : "fade", 

     //Auto height 
     autoHeight : false, 

     //JSON 
     jsonPath : false, 
     jsonSuccess : false, 

     //Mouse Events 
     dragBeforeAnimFinish : true, 
     mouseDrag : true, 
     touchDrag : true, 

     //Transitions 
     transitionStyle : false, 

     // Other 
     addClassActive : false, 
     activeClass:true, 

     //Callbacks 
     beforeUpdate : false, 
     afterUpdate : false, 
     beforeInit: false, 
     afterInit: false, 
     beforeMove: false, 
     afterMove: false, 
     afterAction: false, 
     startDragging : false, 
     afterLazyLoad : false 
    }); 

var owls = $("#owl-slider").data('owlCarousel'); 
owls.goTo($('.item').length);

來源

2015-02-24 07:11:49 skhurams

通過通過addItem()執行踩着我注意到，整個轉盤先被「銷燬」，然後重新添加新的項目。所以現在還沒有真正的解決方案來解決你的問題。

如果您希望在保持滑動動畫的同時跳轉到最新項目（不是從第一個開始，然後從最後一個開始），請嘗試jumpTo()到第二個項目，將超時設置爲10毫秒（不起作用如果在我的情況下省略），然後致電next()。

owl.jumpTo(/*second last item index*/); 
setTimeout(function() { 
    owl.next(); 
}, 10);

來源

2015-10-06 11:51:37 yongtw123

貓頭鷹旋轉木馬addItem問題

回答

相關問題