CODEWITHSUNDEEP
javascriptjqueryowl-carouselowl-carousel-2
Taytorious
Taytorious

Reputation: 324

OwlCarousel 2.0.0-beta.2.4 - can prepend items but not append items with 'add.owl.carousel'

I'm using OwlCarousel 2.0.0-beta.2.4 to display the image, title and dek for all articles of a certain content type. These content types can have several hundred articles. So, I'm displaying the first six then lazyloading the next six as soon as the user reaches the last slide in the carousel.

According to the Owl Docs, this can be achieved by triggering the 'add.owl.carousel' event and specifying the item to add along with the position. This works fine if adding items to positions 0-5, but doesn't work at all for positions 6-11 etc. I've tried several different ways including addItem(). Here's the way it should work (I think) according to the very limited docs:

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);
        }
    });

};

If I set var pos = index;, the content prepends to the the beginning of the carousel as expected. Any ideas on how I can get owl to append items to the end of the carousel?

Upvotes: 0

Views: 422

Answers (1)

erik hermansson
erik hermansson

Reputation: 1

If you omit the position it will append at the end. Like this:

owlCarousel.trigger('add.owl.carousel', [item])

Upvotes: 0

Related Questions