2


純粋な javascript-css チュートリアル用に書いたコードで問題が発生しています。私は JavaScript の初心者で、練習のためにこのコードを書きましたが、クライアントのために行っている作業には完璧だと思います。スライドを変更するには、5 つの関数があります。最初の関数は onload で開始されます。次に、settimeout を使用して次の関数を実行し、次の関数を 5 番目まで使用します。ユーザーが一時停止を押すまで (cleartimeout)。私の問題は、現在のスライド (機能) にとどまっている間に settimeout ループを再開するにはどうすればよいですか? 注：私は今のところjavascriptに固執したいので、jqueryソリューションは必要ありません。

実際のスライドショーをご覧になりたい場合は、http: //fudgepants.com/beta/slideshow/ で F12 キーを押してソース コードを表示できます。

4

1 に答える 1

3

You can create a separate function that controls which function to call. Let's call it showNextSlide().

This function would have a bound variable that cycles from 1 to 5. It calls setTimeout() on itself and to resume you just have to call that function again because it would still know where it left off. 

// keep a reference to the most recent setTimeout() call
var timeOutId;

function showNextSlide()
{
    // initialize the bound variable for the first time
    // this variable gets preserved upon subsequent calls
    this.idx = this.idx || 0;

    switch (this.idx) {
        case 0:
            // code to show slide 1
            break;
        case 1:
            // show slide 2
            break;
        // etc.
    }

    // increase the counter and make sure it doesn't go over 4
    // i.e. 0, 1, 2, 3, 4, 0, 1, 2, 3, 4
    this.idx = (this.idx + 1) % 5;

    // call me in 5 seconds
    timeOutId = setTimeout(showNextSlide, 5000);
}
于 2012-10-20T00:36:57.897 に答える