javascript - change slider item count (Owl Carousel v2)

Question

I want to change items count in mobile devices to 2 or 3, right now in mobile devices is something like this image1

but i want to change it to somrthing like this

image2

i tried to do this with css but it brokes many things in slider

Answer 1

You need to make changes to the javascript file on that page worldsubtitle.info/wp-content/themes/Worldsubtitle/include/js/my-js.js

find this code

$('.custom1').owlCarousel({
    autoplay:false,
    items: 6,
    margin:0,
    stagePadding: 0,
    smartSpeed: 450,
    responsiveClass:true,
responsive:{
    0:{
    items:1,
    nav:true,
    loop:false
    },
    600:{
    items:3,
    nav:true,
    loop:false
    },
    900:{
    items:4,
    nav:true,
    loop:false
    },
    1100:{
    items:6,
    nav:true,
    loop:false
    },
    1000:{
    items:4,
    nav:true,
    loop:false
    }}});

and then you change items number (You should write 3 instead of 1)

$('.custom1').owlCarousel({
    autoplay:false,
    items: 6,
    margin:0,
    stagePadding: 0,
    smartSpeed: 450,
    responsiveClass:true,
responsive:{
    0:{
    items:3,
    nav:true,
    loop:false
    },
    600:{
    items:3,
    nav:true,
    loop:false
    },
    900:{
    items:4,
    nav:true,
    loop:false
    },
    1100:{
    items:6,
    nav:true,
    loop:false
    },
    1000:{
    items:4,
    nav:true,
    loop:false
    }}});