移动设备中的桌面和光滑幻灯片是否可以取消?

Sha*_*dat 7 jquery slider slick.js

我想在桌面上禁用滑块,但需要在移动设备中滑动,你可以帮帮我吗?

$('.slider').slick({
     slidesToShow: 5,
     slidesToScroll: 1,
     autoplay: false,
     autoplaySpeed: 2000,
     responsive: [
        {
           breakpoint: 767,
           settings: "unslick"
        }
     ]
  });
Run Code Online (Sandbox Code Playgroud)

Tob*_*ler 19

比目前接受的答案更清晰的解决方案:添加mobileFirst: true,选项:

$('.slider').slick({
     slidesToShow: 5,
     slidesToScroll: 1,
     autoplay: false,
     autoplaySpeed: 2000,
     mobileFirst: true,
     responsive: [
        {
           breakpoint: 767,
           settings: "unslick"
        }
     ]
  });
Run Code Online (Sandbox Code Playgroud)

这将从低分辨率开始解释您的断点设置,就像它想要的那样.

请参阅Slick文档中的设置部分.

  • 在 window.resize 上仍然给我一个错误:`TypeError: b.$slides is null` (2认同)

use*_*075 11

试试这个:屏幕宽度9999px到768px不会是滑块

('.slider').slick({
    slidesToShow: 5,
    slidesToScroll: 1,
    autoplay: false,
    autoplaySpeed: 2000,
    responsive: [
        {
            breakpoint: 9999,
            settings: "unslick"
        },
        {
            breakpoint: 767,
             settings: {
                    slidesToShow: 3,
                    slidesToScroll: 3,
                    infinite: true,
                    dots: true
                }
        }
    ]
});

  • 请参阅下面的@Tobias Geisler 答案以获得更好的解决方案/sf/answers/3404929321/ (2认同)

小智 6

不幸的是,我的#user1506075版本无法正常运行。我这样解决了这个问题:

 $slickGreen = false;
    function greenSlider(){    
        if($(window).width() < 991){
            if(!$slickGreen){
                $(".greenSlider").slick({
                    dots: false,
                    arrows: false,
                    slidesToShow: 3,
                    slidesToScroll: 1
                });
                $slickGreen = true;
            }
        } else if($(window).width() > 992){
            if($slickGreen){
                $('.greenSlider').slick('unslick');
                $slickGreen = false;
            }
        }
    };

    $(document).ready(function(){
        ....
        greenSlider();
    });
    $(window).on('resize', function(){
         ....
         greenSlider();
    });
Run Code Online (Sandbox Code Playgroud)