Is it posible to hide some elements in slick slider pagination?

userUQJZ 0
Viewed 30

Let's suppose slick slider pagination has 25 pages (it might be possible on mobile devices)

Is it possible to set up a slick slider to show pagination like shown below?

Pagination block: < 1 ... 2 3 4 ... 25 >

Update: what I mean is to hide some pages and show these dots instead

slider slick.js slick frontend javascript
1 Answers

try this

<section class="slider">
    <div>slide1</div>
    <div>slide2</div>
    <div>slide3</div> 
    <div>slide4</div> 
    <div>slide5</div>
</section>
<span class="pagingInfo"></span>

$(".slider").slick({
    autoplay: true,
    dots: true,
    customPaging: function (slider, i) {
        var thumb = $(slider.$slides[i]).data();
        return `<a>${i}</a>`;
    },
    responsive: [
        {
            breakpoint: 500,
            settings: {
                dots: false,
                arrows: false,
                infinite: false,
                slidesToShow: 2,
                slidesToScroll: 2,
            },
        },
    ],
});
Михайло Роздорожнюк0
Related