javascript 在某些断点上启用和禁用 Slick Slider
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32098833/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Enable and disable Slick Slider on certain break points
提问by Hyman Barham
I'm trying to enable Slick Slider (slick.js) to initiate only over 520px wide. Anything below that and the slides just stack (i.e. no slick). Is it possible so that it can work without refreshing the page?
我正在尝试启用 Slick Slider (slick.js) 以仅启动超过 520 像素的宽度。低于此值的任何内容和幻灯片只是堆叠（即没有光滑）。是否有可能在不刷新页面的情况下工作？
I've done this, which works when dragging the browser (narrow) below 500px, but when I move it over 500px it doesn't re-initiate without refreshing the page...
我已经这样做了，这在将浏览器（窄）拖动到 500 像素以下时有效，但是当我将其移动到 500 像素以上时，它不会在不刷新页面的情况下重新启动...
$('.slick').slick({
autoplay: true,
autoplaySpeed: 4000,
delay: 5000,
speed: 700,
responsive: [
{
breakpoint: 500,
settings: "unslick"
}
]
});
Is there a way around this?
有没有解决的办法？
I'm using https://github.com/kenwheeler/slick
回答by Steve
You can try to reconstruct it when the window is resized above 500. This seems to work in my demo.
当窗口大小调整到 500 以上时，您可以尝试重建它。这在我的演示中似乎有效。
function slickify(){
$('.slick').slick({
autoplay: true,
autoplaySpeed: 4000,
delay: 5000,
speed: 700,
responsive: [
{
breakpoint: 500,
settings: "unslick"
}
]
});
}
slickify();
$(window).resize(function(){
var $windowWidth = $(window).width();
if ($windowWidth > 500) {
slickify();
}
});
