jquery - jqueryでアニメーション後に一時停止する方法

Question

jqueryで簡単なアニメーションを作成することをまだ学んでいます。私が今やっているこれは、親 div の左に連続的にスライドする div です。子 div を 2 秒間表示した後に一時停止し、遅延後にアニメーションをもう一度繰り返しようとしていますが、うまくいきません。助けてください。

私のコードを見てください

Answer 1

setTimeout を使用して遅延を作成します。2000年は2秒

setTimeout(function(){
   $('.slide-right').delay(5000).css({width:'0'}).animate({width:'100%'}, 800, reslide); 
}, 2000);

例はこちら

Answer 2

これは少し簡単な例です。

html:

<div id="slideRange">
    <div id="slideBox">woohoo</div>
</div>

CSS:

#slideRange{
    width: 100%;
    height:150px;
    position: relative;
    background: green;
}

#slideBox{
    background-color: red;
    color: white;
    width: 150px;
    height:150px;
    line-height:150px;
    vertical-align: middle;
    text-align: center;
    position: absolute;
    left: 0;
}

js:

function mySlide() {
    var slideRange = parseInt($('#slideRange').css('width')) - parseInt($('#slideBox').css('width'));
    $('#slideBox')
    .animate({left: 0}, 500)
    .delay(500)
    .animate({left: slideRange}, 1000, function() {
        setTimeout(mySlide, 2000);
    });
}

$(document).ready(function() {
    mySlide(10);
});

デモ: http://jsfiddle.net/RUvZZ/