Question

您好我正在关注this tutorial

用于构建jquery滑块，我需要的是在显示六张幻灯片之后重定向到另一个网页，目前它正在重复幻灯片。

一些代码

$('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的末尾。所以没有六个。

您需要添加其他选项slideShown并在slide

的fade和jwSlider个函数中调用它

...
    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";
    }
});

显示六个滑块图像后，jquery重定向

2 个答案: