Search code examples
javascriptjqueryowl-carousel

Owl carousel customised image preview pagination not working

I am taking a look at this neat creation by Yunus Gaziev but there is one major problem with it - the pagination is removed as soon as you adjust the viewport, which seems to be caused by Owl, and I do not know why.

var owl;

$(document).ready(function() {
    owl = $("#owl-demo");
    owl.owlCarousel({
        navigation: false,
        slideSpeed: 300,
        paginationSpeed: 400,
        singleItem: true,
        afterInit: afterOWLinit
    });

    function afterOWLinit() {
        ...
    }

});
Solution

  • The problem was that the owlCarousel initialiser needed to have afterUpdate: afterOWLinit declared so that whenever the viewport was resized, it would fire the customised pagination script again.

    I have refactored the existing code thoroughly, an example may be viewed here - my version can be cloned from here.