2

Web サイト用に Javascript で作成したスライドショーを使用しています。カウンターを追加したい。

1/3...

スライド 1 / 合計スライド...

解決策を見つけることができません...

ここに私のコードがあります:

$(document).ready(function() {
    // set display:none for all members of ".pic" class except the first
    $('.image_news:gt(0)').hide();

    // stores all matches for class="pic"
    var $slides = $('.image_news');

    $slides.click(function(){
        // stores the currently-visible slide
        var $current = $(this);    
        if( $current.is($slides.last()) ) {
            $current.hide();
            $slides.first().show();
        } 
        // else, hide current slide and show the next one
        else {
            $current.hide().next().show(); 
        }
    });
});

例を含む fsfiddle リンク: http://jsfiddle.net/XRpeA/3/

助けてくれてありがとう!

4

5 に答える 5

1

どうもありがとう。最初のオプション @Hiral を使用します。私のウェブサイトに別のスライドショーがあり、他のオプションを試してみるとうまくいきません...しかし、どうもありがとうございました!

もう一つ直さなければならないことがあります。ページに 2 つまたは 3 つのスライドショーがある場合、機能しません... 管理ページでリピーター カスタム フィールドを使用しているため、必要なスライドショーの数を事前に知ることができません.. . どうすれば修正できるか知っている人はいますか? ここにjsfiddleがあります:http://jsfiddle.net/XRpeA/13/

<div id="slideframe">
    <img class="image_news" src="http://s1.lemde.fr/image/2007/07/09/534x0/933544_5_aa6d_polynesie-bora-bora_0608bcead896ce3f59fc0e2fb3cc7435.jpg" />
    <img class="image_news" src="http://production.slashmedias.com/main_images/images/000/005/357/IMAGE-PENSEE-HD-1_original_original_large.jpg?1372235419" />
    <img class="image_news" src="http://images.telerama.fr/medias/2013/03/media_94814/une-image-un-film-l-auberge-de-dracula-1931,M106823.jpg" />
</div>
<br>
    <div id="counter">image <span id="current">1</span> / <span id="total"></span></div>

 <br><br>

<div id="slideframe">
<img class="image_news" src="http://s1.lemde.fr/image/2007/07/09/534x0/933544_5_aa6d_polynesie-bora-bora_0608bcead896ce3f59fc0e2fb3cc7435.jpg" />
<img class="image_news" src="http://production.slashmedias.com/main_images/images/000/005/357/IMAGE-PENSEE-HD-1_original_original_large.jpg?1372235419" />
<img class="image_news" src="http://images.telerama.fr/medias/2013/03/media_94814/une-image-un-film-l-auberge-de-dracula-1931,M106823.jpg" />
</div>
<br>
<div id="counter">image <span id="current">1</span> / <span id="total"></span></div>

どうもありがとう

于 2013-11-12T18:04:10.863 に答える