一页中有两个弹性滑块

Question

我在一个页面中有两个弹性滑块。我需要他们两个滑块分开工作。怎么样？

<section class="slider">
  <div id="frist-slider" class="flexslider">
    <ul class="slides">
      <li><img src="img-1.jpg" /></li>
      <li><img src="img-2.jpg" /></li>
    </ul>
  </div>
  <div class="custom-navigation">
    <div class="custom-controls-container"></div>
  </div>
</section>

<section class="slider">
  <div id="second-slider" class="flexslider">
    <ul class="slides">
      <li><img src="img-1.jpg" /></li>
      <li><img src="img-2.jpg" /></li>
    </ul>
  </div>
  <div class="custom-navigation">
    <div class="custom-controls-container"></div>
  </div>
</section>

我为此代码使用默认的flex滑块java脚本。

Answer 1

您可以为每个flexslider设置不同的选项，如下所示：

$（ '＃弗里斯特滑块'）。flexslider（{         选项：xyz，....       }）;

$（ '＃第二滑块'）。flexslider（{         选项：xyz，....       }）;

可能重复：

How to set up multiple sliders with flexslider?