将垂直轮播（桌面）切换到移动设备中的水平轮播

Question

他们知道一个插件可以让我在移动设备上将垂直（桌面视图）轮播更改/转换为水平轮播？

现在我正在使用 slick 插件，但我无法得到我需要的结果，这是我的 JS 代码：

          $('.demo-slider).slick({
                      vertical: true;
                    });
           var windowWidth = $(window).width();
              if(windowWidth < 768){
                  $('.demo-slider').slick('unslick',function(){
                   $('.demo-slider).slick({
                      vertical: false;
                    });
                });
           }

Answer 1

$('.demo-slider).slick({    
vertical: true,
responsive: [               
{
    breakpoint: 767,
    settings: {
    vertical: false
    }
}]
});

Slick 有自己的响应断点。这样会好很多

Answer 2

我认为你出错的地方是你初始化 slick() 两次（你也忘记在你的 jQuery 选择器上关闭 '）。我会将虚假媒体查询切换到 slick() 的初始化之外，如下所示：

// 1- Get window width 
var windowWidth = $(window).width();

// 2- For all devices under or at 768px, use horizontal orientation
if(windowWidth <= 768) {
  $('.demo-slider').slick({
    vertical: false,
  });
} 
// 3- For all devices over 768px, use vertical orientation
else {
  $('.demo-slider').slick({
    vertical: true,
  });
}

*注意，我从来没有使用过 slickslider，只是看你的 JS。