0

私は最近、クラス名によって div で bx-slider を複数回呼び出すサイトを構築しました。通常のページャーを使用すると問題なく動作しますが、サムネイル付きのカスタム ページャーを使用するとエラーが発生します。「pagerCustom」オプションをオンにしてスライダーをナビゲートすると、ページ上のすべてのスライダーに影響するようです。

以下は、縮小されたテスト ケースです: http://codepen.io/DavidVII/full/jhoIc

サムネイルをクリックして、両方のスライダーがどのように変化するかを確認します。

私の CodePen をフォークしたい場合は、こちらのリンクをチェックしてください: http://codepen.io/DavidVII/pen/jhoIc

プラグインの github ページで新しい問題を作成しましたが、stackoverflow で常に運が良かったので、ここに投稿すると思いました。

4

2 に答える 2

0

これは、両方のスライダーを単一のクラスで初期化したためです。と のような 2 つの別個のクラスで行う必要があります.bxslider1。.bxslider2

<div class="container">
  <ul class="bxslider1">
    <li><img src="http://bxslider.com/images/730_200/tree_root.jpg" /></li>
    <li><img src="http://bxslider.com/images/730_200/houses.jpg" /></li>
    <li><img src="http://bxslider.com/images/730_200/hill_fence.jpg" /></li>
  </ul>
  <ul class="bxslider2">
    <li><img src="http://bxslider.com/images/730_200/tree_root.jpg" /></li>
    <li><img src="http://bxslider.com/images/730_200/houses.jpg" /></li>
    <li><img src="http://bxslider.com/images/730_200/hill_fence.jpg" /></li>
  </ul>
</div>
<script>
    $('.bxslider1').bxSlider();
    $('.bxslider2').bxSlider();
</script>
于 2015-01-07T09:47:53.813 に答える