0

このアニメーションをループさせようとしていますが、なぜうまくいかないのですか? 差分画像を持つ 4 つの div があり、これをループして何度も再生したいと考えています。

$(document).ready(function () {
    setInterval("comeon()", 2000);
});

function comeon() {
    var current = $(".current");
    var next = current.next();

    if (next.length == 0) {
        next = $(".current:first");
    }

    current.removeClass('current').addClass('previous');
    next.css("opacity", "0.0").addClass("current").animate({
        opacity: 1.0
    }, 500, function () {
        current.removeClass("previous");
        comeon();
    });

私が間違ったことをしましたか？

**UPDATE**



<div id="slider">
<div class="current" style="background-color:#F00;position:absolute; width:400px; height:400px;"></div>
<div style="background-color:#00F;position:absolute; width:400px; height:400px;"></div>
<div style="background-color:#0F0;position:absolute; width:400px; height:400px;"></div>
<div style="background-color:#FF3;position:absolute; width:400px; height:400px;"></div>

</div><!-- End slider-->

http://jsfiddle.net/7kt9z/6/をご覧ください。

4

2 に答える 2

0

setInterval は特定の方法で使用する必要があります。

setInterval を変数に割り当てる必要があり、この割り当てはイベントに添付する必要があります。

var setIt;
$(window).load(function() {
    setIt = setInterval(comeOn, 1000);
});

画像を使用しているため、すべての画像が読み込まれるのを待ってから、スライダーを開始できます (loadイベントを使用setIntervalして変数に割り当てますsetIt)。

また、関数を qoutes in でラップしないでくださいsetInterval。それ以外の：

setInterval("comeOn()", 1000)

これを行う：

setInterval(comeOn, 1000)

ここに実例があります： http://codepen.io/anon/pen/rHzpL

于 2013-09-23T18:50:14.717 に答える