Javascript 光滑的旋转木马从右到左
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29770969/
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
Slick carousel right to left
提问by bengem
I've setup slick carousel to continuously scroll, however I need to to scroll in the oposite direction. Adding the RTL option didn't seem to work.
我已经设置了光滑的轮播来连续滚动，但是我需要向相反的方向滚动。添加 RTL 选项似乎不起作用。
Fiddle here (currently left to right)
在这里小提琴（目前从左到右）
$(function(){
$('.slider').slick({
speed: 10000,
autoplay: true,
autoplaySpeed: 100,
cssEase: 'linear',
slidesToShow: 1,
slidesToScroll: 1,
variableWidth: true
});
});
回答by Bob Tate
Change the slidesToScroll to a -1 (it will change the slide direction)
将 slidesToScroll 更改为 -1（它将改变滑动方向）
$(function(){
$('.slider').slick({
speed: 10000,
autoplay: true,
autoplaySpeed: 100,
cssEase: 'linear',
slidesToShow: 1,
slidesToScroll: -1,
variableWidth: true
});
});
回答by Boy Mark
Setup "slidesToScroll" property to a negative value (e.g slidesToScroll: -1,) is not a native solution. This produced images smooth flow problem.
将“slidesToScroll”属性设置为负值（例如slidesToScroll: -1,）不是本机解决方案。这产生了图像平滑流问题。
The right way is to add an attribute dir="ltr"to the slider's container (HTML element) OR add rtl: falseproperty to slider settings:
正确的方法是向dir="ltr"滑块的容器（HTML 元素）添加rtl: false属性或向滑块设置添加属性：
// add an attribute dir="ltr" to the slider's container
//$('.slider').attr('dir', 'ltr');
// OR add `rtl: false` property to slider settings
$('.slider').slick({
autoplay: true,
slidesToShow: 3,
slidesToScroll: 3,
dots: true,
infinite: true,
cssEase: 'linear',
rtl: false
});
Note: This will reverse text direction also which can be changed by the CSS direction: ltr;
注意：这也将反转文本方向，这也可以由 CSS 更改 direction: ltr;
回答by Bilal Talal
in your rtl css add below without any edit on
在你的 rtl css 中添加下面没有任何编辑
[dir='rtl'] .slick-slide { float: left; }
[dir='rtl'] .slick-slide { float: left; }
回答by Rijo
Here is the example for verticalslider from top to bottom.
这是从上到下垂直滑块的示例。
http://jsfiddle.net/mth2ghod/114/
http://jsfiddle.net/mth2ghod/114/
$(function(){
$('.slider').slick({
speed: 5000,
autoplay: true,
autoplaySpeed: 0,
cssEase: 'linear',
slidesToShow: 1,
slidesToScroll: -1,
vertical: true
});
});
回答by Juandres Yepes Narvaez
know this is old, but the slick docs says:
知道这是旧的，但光滑的文档说：
Note: the HTML tag or the parent of the slider must have the attribute "dir" set to "rtl".
注意：HTML 标记或滑块的父级必须将属性“dir”设置为“rtl”。
