0

5 つの画像などを連続してループするスライドショーを作成しています。うまくループしていますが、ループが開始および停止しません。私は一時停止 = true/false 変数を使用し、コード全体に if ステートメントを追加していました - 見栄えも効率も良くありません (例から取り出しました)。ステートメントなどの後にループが一時停止すると、アニメーションが台無しになり、画像が失われます。

このようなループを制御するための標準的な方法はありますか?

function setupSlideShow(){
    // Setup SlideShow stuff here then start the loop
    slideBoxTransition()
}

var page = 1;
function slideBoxTransition(){
    switch (settings['transition']['effect']){
        case "slide" :
            next.css({left:settings['width']+"px",top:0,display:"block"});
            current.animate({left: "-="+width+"px"}, {duration : speed, easing : easing, queue : false});
            next.animate({left: "-="+width+"px"}, {duration : speed, easing : easing, queue : false, complete : function(){
                current.css("display","none")
                slideBoxGetImage();
            }});
            break;
    }
}

function slideBoxGetImage(){
    current = $self.eq($self.index(next))
    page += 1;
    if(page < $self.length){
        next = $self.eq( $self.index(current) + 1 );
    }else{
        page = 0;
        next = $self.first();
    }
    slideBoxTimeout();
}

function slideBoxTimeout(){
    setTimeout(function(){
        slideBoxTransition();
    }, delay);
}

何でも大歓迎です！

ありがとう。

4

1 に答える 1

1 
var interval;
function slideBoxTimeout(){
    var interval = setInterval(function(){
        slideBoxTransition();
    }, delay);
}

$(".play").click(function() {
    slideBoxTimeout();
});
$(".pause").click(function() {
    clearInterval(interval);
});

から取得：jQueryの再生/一時停止jQuery関数

于 2013-01-17T11:43:24.197 に答える