0

私がやろうとしているのは、手早く汚いスライド ショーを作成することです。空の「マスター」imgタグと一連のdivを含むマスターdivがあり、それぞれに独自のimgとspanタグが含まれているという考えです。次に、各イメージのソースがマスター イメージのソースとして設定されます。そのため、各画像の反復処理を開始し、そのソースを setTimeout() と 2 秒の遅延でマスター img のソースに設定しようとしました。私が抱えている問題は、コードが 2 秒間待機し、シーケンスの最後の画像のみを表示するように見えることです。

$(document).ready(function () {
    $('div#slideshow').children('div.slideshowsourceimage').each(function () {
        var src = $(this).children('img').attr('src');
        var desc = $(this).children('span').text();

        setTimeout(function () {
            $('img#slideshowimage').attr('src', src);
        }, 2000);
    });
});

私が間違っていることを見つけるのを助けるために、2番目の目を得ることができれば、私はそれを感謝します.

ありがとう、

4

2 に答える 2

2

私はこのようなことをします:

$(function() {
    var $images = $('#slideshow div.slideshowsourceimage');
    var x = 0;
    setInterval(function() {
        if(x == $images.length) { // start over if we get to the last one
            x = 0;
        }

        var $cur = $images.eq(x);
        var src = $cur.find('img').attr('src');
        var desc = $cur.find('span').text();

        $('#slideshowimage').attr('src', src);
        x++;
    }, 2000);
});
于 2012-07-18T19:16:07.767 に答える
1

setInterval を使用するか、表示される各画像間の秒数を増やす必要があります。現在起こっていることは、すべてが 2 秒で発生するように登録されているため、最後の画像のみが表示されていることです。何かのようなもの

$(document).ready(function () {
    var time=0;
    $('div#slideshow').children('div.slideshowsourceimage').each(function () {
        var src = $(this).children('img').attr('src');
        var desc = $(this).children('span').text();

        setTimeout(function () {
            $('img#slideshowimage').attr('src', src);
            time+=2000;
        }, time);
    });
});
于 2012-07-18T19:09:38.683 に答える