我使用OwlCarousel 2.0.0-beta 2.4来显示特定内容类型的所有文章的图像、标题和dek。这些内容类型可以有几百篇文章。因此,我将显示前六张幻灯片,然后在用户到达转盘中的最后一张幻灯片时懒散地加载下六张幻灯片。
根据Owl文档,这可以通过触发"add.Owl.coroundle"事件并指定要添加的项目和位置来实现。如果将项目添加到位置0-5,这很好,但对于位置6-11等,这根本不起作用。我已经尝试了几种不同的方法,包括addItem()。根据非常有限的文档,以下是它的工作方式(我认为):
BucketCarousel.prototype.fetchMoreItems = function(callback) {
var self = this;
$.ajax(this.fetchURL, {
dataType: 'json',
data: {page: this.page},
error: function(response) {
console.log('error', response);
},
success: function(response) {
$(response.bucket_items).each(function(index, item) {
var pos = self.position+index;
self.owlCarousel.trigger('add.owl.carousel', [item, pos]);
});
self.hasmore = response.has_more;
self.page++;
(callback || $.noop).apply(self);
}
});
};
如果我设置var pos=index,内容按预期准备到转盘的开头。关于如何让owl将项目附加到旋转木马的末尾,有什么想法吗?
如果省略位置,它将附加在末尾。像这样:
owlCarousel.trigger('add.owl.carousel', [item])