Javascript 将多个滑动条同步在一起

Javascript 将多个滑动条同步在一起,javascript,jquery,slick.js,Javascript,Jquery,Slick.js,我正在使用Slick Slider,希望将3个滑块同步在一起 我这里有一点问题: HTML: 我可以让滑块1与滑块2同步,也可以让滑块2与滑块3同步,但我无法让所有3个一起工作。有什么办法可以让它工作吗 谢谢像这样的东西怎么样: HTML: 现在,所有的滑块都有一个通用的滑块类和一个编号的滑块类,如果您需要在其他时间对它们执行不同的操作。只需在asNavFor中使用多个类即可。例如: asNavFor: $('.slider, .slider2, .slider3') 在为每个滑块设置不同

我正在使用Slick Slider,希望将3个滑块同步在一起

我这里有一点问题:

HTML:

我可以让滑块1与滑块2同步,也可以让滑块2与滑块3同步,但我无法让所有3个一起工作。有什么办法可以让它工作吗


谢谢

像这样的东西怎么样:

HTML:


现在,所有的滑块都有一个通用的
滑块类和一个编号的滑块类,如果您需要在其他时间对它们执行不同的操作。

只需在asNavFor中使用多个类即可。例如:

asNavFor: $('.slider, .slider2, .slider3')

在为每个滑块设置不同设置的情况下,如何使用此选项?您可能想将此作为一个新问题提问。@RoeeYossef我也需要此答案,我需要第二个滑块具有淡入淡出效果,并且没有箭头必须-@jaybee
$(".slider").slick({});
$(".slider2").slick({ asNavFor: '.slider' });
$(".slider3").slick({ asNavFor: '.slider2' });
<section class="slider slider1">
    <div>slide1</div>
    <div>slide2</div>
    <div>slide3</div>
    <div>slide4</div>
    <div>slide5</div>
    <div>slide6</div>
</section>

<section class="slider slider2">
    <div>slide1</div>
    <div>slide2</div>
    <div>slide3</div>
    <div>slide4</div>
    <div>slide5</div>
    <div>slide6</div>
</section>

<section class="slider slider3">
    <div>slide1</div>
    <div>slide2</div>
    <div>slide3</div>
    <div>slide4</div>
    <div>slide5</div>
    <div>slide6</div>
</section>
$(".slider").slick({ asNavFor: '.slider' });
asNavFor: $('.slider, .slider2, .slider3')