Owl Carousel is working in magento 2 luma theme but other functions like dots, next and prev not displaying?

magento.stackexchange https://magento.stackexchange.com/questions/284587

  •  09-03-2021
  •  | 
  •  

Question

enter image description here

The owl carousel slider is working fine as drag. But I can't able to see any dots or next, prev icons. Please tell me how to display that?

autoplay: true, dots: true are not working.

enter image description here

Was it helpful?

Solution

you Can Try this

  require(["jquery"
], function ($) {



        $(document).ready(function($) {

        var owl = $("#owlslider");
         owl.owlCarousel({
        items                   : 5,
        itemsDesktop            : [1199,4],
        itemsDesktopSmall       : [979,3],
        itemsTablet             : [768,2],
        itemsTabletSmall        : false,
        itemsMobile             : [479,1],
        singleItem              : false,
        itemsScaleUp            : false,
        slideSpeed              : 200,
        paginationSpeed         : 800,
        rewindSpeed             : 1000,
        autoPlay                : false,
        stopOnHover             : true,
        navigation              : true,
        navigationText          : ["prev","next"],
        rewindNav               : true,
        scrollPerPage           : true,
        pagination              : true,
        paginationNumbers       : false,
        responsive              : true,
        responsiveRefreshRate   : 200,
        responsiveBaseWidth     : window,
        baseClass               : "owl-carousel",
        theme                   : "owl-theme",
        lazyLoad                : false,
        lazyFollow              : true,
        lazyEffect              : "fade",
        autoHeight              : false,
        jsonPath                : false,
        jsonSuccess             : false,
        dragBeforeAnimFinish    : true,
        mouseDrag               : true,
        touchDrag               : true,
        addClassActive          : false,
        transitionStyle         : false,
        beforeUpdate            : false,
        afterUpdate             : false,
        beforeInit              : false,
        afterInit               : false,
        beforeMove              : false,
        afterMove               : false,
        afterAction             : false,
        startDragging           : false
        });
    });
   });

</script>

OTHER TIPS

In your Script

Replace This :

navigation : true

With This :

nav : true

Owl Carousel docs

Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top