切换垂直旋转木马(桌面)水平旋转木马在移动

Question

他们知道一个插件可以让我在移动设备上改变/转换垂直(桌面视图)旋转木马到水平旋转木马吗?

现在我正在使用光滑的插件，但我不能得到我需要的结果，这是我的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,
  });
}

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