Ответы пользователя по тегу CSS
  • Как взаимодействовать с breakpoint в slick slider?

    @depressionofoleg
    С помощью responsive это вряд ли как-то можно сделать, но можно ограничить срабатываение скрипта в зависимости от размера экрана и ресайза.
    function mobileOnlySlider() {
        $(document).ready(function(){
                $('.slider').slick({
                    slidesToShow:3,
                    slidesToScroll: 1,
                    centerMode: true,
                    centerPadding: '0px',
                    speed: 700,
                    infinite: true,
                    responsive: [
                        {
                            breakpoint: 576,
                            settings: {
                                slidesToShow: 2,
                                slidesToScroll: 1
                            }
                        }
                    ]
                });
        })
    }
    
    if (window.innerWidth >= 768) {
        mobileOnlySlider();
    }
    
    $(window).resize(function() {
        if(window.innerWidth >= 768) {
            if($('.slider').hasClass('slick-initialized')) {
                return;
            }
            mobileOnlySlider();
        } else {
            if($('.slider').hasClass('slick-initialized')) {
                $('.slider').slick('unslick');
            } else {
                return;
            }
        }
    Ответ написан