Slick Carousel - 颠倒顺序

Question

我正在开发的网站上使用 Slick Carousel。

我面临的一个问题是试图让 "slider-nav" 向与标准相反的方向移动。

示例：-

目前顺序如下：-

1 2 3 4 5 6

我需要它运行如下：-

6 5 4 3 2 1

我知道我可以颠倒我当时推入的顺序，但我需要发生以下情况：-

6 5 4 3 2 1
1 6 5 4 3 2
2 1 6 5 4 3
etc...

我试图将 "slidesToScroll" 设置为 -1（如我所见），但这只会导致我的页面甚至在 fiddle.

上崩溃

我当前的代码如下：-

 $('.slider-for').slick({
  slidesToShow: 1,
  slidesToScroll: 1,
  arrows: false,
  fade: true,
  asNavFor: '.slider-nav',
  autoplay: true,
  centerMode: false,
});
$('.slider-nav').slick({
  slidesToShow: 5,
  infinite: true,
  slidesToScroll: 1,
  asNavFor: '.slider-for',
  dots: false,
  centerMode: false,
  focusOnSelect: true,
});

基本设置：-

https://jsfiddle.net/5cyqtvt6/9/

我也曾尝试使用 rtl 设置，但出于某种原因，这刚开始显示空白幻灯片。

例如。 https://jsfiddle.net/5cyqtvt6/14/

如有任何帮助，我们将不胜感激。

Answer 1

我通过添加

设法解决了这个问题

<div class="slider-for" dir="rtl">

和

<div class="slider-nav" dir="rtl">

并将 jQuery 更新为以下内容：-

 $('.slider-for').slick({
    slidesToShow: 1,
    slidesToScroll: 1,
    arrows: false,
    fade: true,
    asNavFor: '.slider-nav',
    autoplay: true,
    centerMode: false,
    rtl: true
});
$('.slider-nav').slick({
    slidesToShow: 5,
    infinite: false,
    slidesToScroll: 1,
    asNavFor: '.slider-for',
    dots: false,
    centerMode: true,
    focusOnSelect: true,
    rtl: true
});

正在工作的 jsFiddle：- https://jsfiddle.net/5cyqtvt6/16/

Slick Carousel - 颠倒顺序

Slick Carousel - Reversing order

html

javascript

jquery

slick.js