jquery - 6つのスライダー画像を表示した後のjqueryリダイレクト

Question

こんにちは、私はこのチュートリアルに従っています

jqueryスライダーを構築するために必要なのは、現在6つのスライドを表示した後、別のWebページにリダイレクトすることです。現在、スライドを繰り返しています。

いくつかのコード

$('ul').jwSlider({
    speed : 2500,
    pause : 3000
});

ありがとう

Answer 1

jwSlider には、この目的のためのコールバックが含まれていないようです。この特別な使用例では、プラグインを拡張する必要があります。

ただし、リダイレクトが発生するまでの秒数をカウントする簡単な回避策を使用できます。

var timeUntilRedirect = numberOfSlides * (speedInMilliseconds + pauseInMilliseconds)

setTimeout(function() {

  // redirect, e.g.:
  window.top.location.href="http://yourdomain.com"

}, timeUntilRedirect);

Answer 2

現在、最初の要素を削除し、 の最後に追加しulます。したがって、6 はありません。

別のオプションを追加して、と関数のslideShown両方で呼び出す必要があります。slidefadejwSlider

...
    var defaults = {
            speed : 1000,
            pause : 2000,
            transition : 'fade',
            slideShown: $.noop
        },
...
        function slide() {
            setInterval(function() {
                // Animate to the left the width of the image/div
                $this.animate({'left' : '-' + $this.parent().width()}, options.speed, function() {
                    // Return the "left" CSS back to 0, and append the first child to the very end of the list.
                    $this
                       .css('left', 0)
                       .children(':first')
                       .appendTo($this); // move it to the end of the line.
                    options.slideShown(); // <------ added call
                })
            }, options.pause);
        } // end slide

        function fade() {
            setInterval(function() {
                $this.children(':first').animate({'opacity' : 0}, options.speed, function() {   
                    $this
                       .children(':first')
                       .css('opacity', 1) // Return opacity back to 1 for next time.
                       .css('zIndex', $this.children(':last').css('zIndex') - 1) // Reduces zIndex by 1 so that it's no longer on top.                  
                       .appendTo($this); // move it to the end of the line.
                    options.slideShown(); // <------ added call
                })
            }, options.pause);
        } // end fade   

それから電話する

var slidesShown = 0;
$('ul').jwSlider({
    speed : 2500,
    pause : 3000,
    slideShown: function(){
        slidesShown++;
        if (slidesShown == 6)
            window.location = "http://go.to/somewhere";
    }
});