0

Foundation フレームワークと Orbit を使用しています。ここにスライダーを作成しました: http://www.abricot-production-dev.co.uk/group-two/gallery.html# しかし、親指は現時点ではメインの写真を変更していません.

私のコード: 

<div id="slider">
    <img src="images/slider/image-01.jpg" data-thumb="image-01.jpg" data-caption="#captionOne"/>
    <img src="images/slider/image-02.jpg" data-thumb="image-02.jpg" data-caption="#captionTwo"/>
    <img src="images/slider/image-03.jpg" data-thumb="image-03.jpg" data-caption="#captionThree"/>
</div>

<span class="orbit-caption" id="captionOne">Here is another caption...</span> 
<span class="orbit-caption" id="captionTwo">Here is a caption 2...</span> 
<span class="orbit-caption" id="captionThree">And here is a caption 3...</span>

<ul class="orbit-bullets">
    <li class="has-thumb" style="background-image: url(images/slider/thumbs/image-01.jpg); background-position: initial initial; background-repeat: no-repeat no-repeat; ">1</li>
    <li class="has-thumb" style="background-image: url(images/slider/thumbs/image-02.jpg); background-position: initial initial; background-repeat: no-repeat no-repeat; ">2</li>
    <li class="has-thumb" style="background-image: url(images/slider/thumbs/image-03.jpg); background-position: initial initial; background-repeat: no-repeat no-repeat; ">3</li>
</ul>

</div>

初期化済み:

<script>
   $(window).load(function() {
       $("#slider").orbit();
   });
</script>

そしてfoundation.min.jsで：

bullets:!1, bulletThumbs:!0, bulletThumbLocation:"../images/slider/thumbs/"

私は何が欠けていますか？

アンディ

4

1 に答える 1