jQuery 在 Slick Slider 中显示没有中心模式的下一张幻灯片的一半
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/41905363/
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
Show half of next slide without Center Mode in Slick Slider
提问by Cook88
What I want is to have a slider that shows 3.5 slides at once, with the right most slide being the one that is only half shown. I have seen something like this done successfully using centerMode and centerPadding with slick slider, but I do not want the slides to be centered. In other words, I want the left most slide to be flush with the side of the window, totally in view, but the right most slide to be half in the window, half off. Is this possible in slick? I've seen people using slidesToShow: 3.5, but this makes the left most slide go half off the screen and I need it on the right.
我想要的是有一个一次显示 3.5 张幻灯片的滑块，最右边的幻灯片是只显示一半的幻灯片。我已经看到使用带有光滑滑块的 centerMode 和 centerPadding 成功完成了这样的事情，但我不希望幻灯片居中。换句话说，我希望最左边的幻灯片与窗口的一侧齐平，完全在视野中，但最右边的幻灯片一半在窗口中，一半不在。这有可能吗？我见过有人使用 slidesToShow: 3.5，但这会使最左边的幻灯片离开屏幕的一半，我需要它在右边。
回答by Abdul Rahman
No need to add "slidesToShow: 3.5 option"
无需添加“slidesToShow: 3.5 选项”
Just call slick:-
只需致电光滑：-
$('.Your-container').slick({
arrows: false,
});
and add following CSS:
并添加以下 CSS：
.slick-list{padding:0 20% 0 0;}
Either you can give a fixed padding to the right or percentage.
您可以在右侧或百分比上提供固定的填充。
回答by kophygiddie
You can do something like this slidesToShow: 3.5and make infinite: false. The right most slide will be showing half.
你可以做这样的事情slidesToShow: 3.5并 make infinite: false。最右边的幻灯片将显示一半。
回答by Gcamara14
You can also do this in slick by adding these two parameters in the slick init:
您也可以通过在 slick init 中添加这两个参数来在 slick 中执行此操作：
centerMode: true,
centerPadding: '20%',
This is the equivalent to
这相当于
.slick-list{padding:0 20% 0 0;}
回答by kosmeln
Please beware of using slidesToShowwith decimal places.
请注意使用slidesToShow小数位。
According to Official DocumentationslidesToShowis of type intand not float.
Using it as float is causing unpredictable exceptions on breakpointevent (when you have custom breakpoint option specified).
根据官方文档slidesToShow是 typeint而不是float. 将它用作 float 会导致不可预测的breakpoint事件异常（当您指定了自定义断点选项时）。
You can read more about those issue in official Slick GitHub threads here, here.
