0

在这里我有一个问题，我想做一个滑块，我window.clearTimeout(timer)在函数nextSlide()和prevSlide(). 你能帮助我吗 ？

var timer = new Object;

function slider(){
nextSlide();
window.setTimeout(slider, 5000);
}

function nextSlide(){
var $Slides = $(".contenu");
$Slides.animate(
    {left: "-=213px"},
    1000,
    function(){
        $Slides.data("currentSlide",$Slides.data("currentSlide")+1);
        if($Slides.data("currentSlide") > $Slides.data("nbSlides")) {
            $Slides.data("currentSlide",1).css({left:"-213px"});
        }
    }
    window.clearTimeout(timer);
    timer = window.setTimeout(slider, 5000);
  );
}

function prevSlide(){
var $Slides = $(".contenu");
$Slides.animate(
    {left:"+=213px"},
    1000,
    function(){
        $Slides.data("currentSlide", $Slides.data("currentSlide")-1);
        if($Slides.data("currentSlide") == 0) {
            $Slides.data("currentSlide",$Slides.data("nbSlides")).css({left:-(213*$Slides.data("currentSlide"))});
        }
    }
    window.clearTimeout(timer);
    timer = window.setTimeout(slider, 5000);
);
}

这里加载：

$(function(){

slider();


$('#slider').addClass('slider');
var $Slides = $('.contenu');
var _step = $Slides.find(".slide:first").width();

$Slides.data("currentSlide",1).data("nbSlides",$Slides.find('.slide').size());

$Slides.find(".slide:last").clone().prependTo(".contenu");

$Slides.find(".slide:first").next().clone().appendTo('.contenu');

$Slides.find(".slide:first").addClass("clone").end().css({left:-_step});

$Slides.width($Slides.find(".slide").size()*_step);

$('.next').bind("click", nextSlide);
$('.prev').bind("click", prevSlide);
});

谢谢帮助。;)

4

3 回答 3

2

你还在.animate()通话中，你应该向上);移动window.clearTimeout(timer)。

此答案假设您想在启动动画后直接设置 timeOut，如果您想在动画的回调中设置 timeOut，您应该按照 David 的回答将其移至 above }。

编辑：
根据您的评论，我为您制作了此功能：

function nextSlide(){
    var $Slides = $(".contenu");
    $Slides.animate(
        {left: "-=213px"},
        1000,
        function(){
            $Slides.data("currentSlide",$Slides.data("currentSlide")+1);
            if($Slides.data("currentSlide") > $Slides.data("nbSlides")) {
                $Slides.data("currentSlide",1).css({left:"-213px"});
            }
            window.clearTimeout(timer);
            timer = window.setTimeout(slider, 5000);
        }
    );
}
于 2013-01-08T12:22:45.190 回答
1

函数调用参数应该用逗号分隔，,但是在你的情况下，你用分号分隔它们;- 该行以分号而不是逗号结尾。也是下一行。这不是一个包含多个语句的函数体，而是一个函数调用 (to animate)，因此您需要使用逗号。

另一方面 - 这些可能不是参数，因此您需要将结束);部分移到这些行上方，以便它们成为单独的语句而不是函数参数。

于 2013-01-08T12:23:19.900 回答
0

此代码片段：

window.clearTimeout(timer);
timer = window.setTimeout(slider, 5000);

被断章取义。您需要将其放置在函数内或全局范围内以使其工作，f.ex：

function(){
    $Slides.data("currentSlide", $Slides.data("currentSlide")-1);
    if($Slides.data("currentSlide") == 0) {
        $Slides.data("currentSlide",$Slides.data("nbSlides")).css({left:-(213*$Slides.data("currentSlide"))});
    }
    window.clearTimeout(timer);
    timer = window.setTimeout(slider, 5000);
}
于 2013-01-08T12:22:17.787 回答