0

これを無限ループで発生させて、ある時点で終了できるようにしたいのですが、それはポイントではありません..

したがって、ビデオまたは画像のいずれかを含む dom 要素のリストがあります。

私が最初に見たのは、これは画像ですか、もしそうなら:

Display the image for X seconds
Then continue

動画だと

I play the video, and on the onend event, I continue

今、私は再びプロセスを開始し、ビデオまたは画像をもう一度見てください。したがって、フローは永遠に続き、最後に到達すると、最初の要素に移動します。

すべてを実行しても問題はありませんが、それをループに入れてX時間一時停止するか、ビデオの再生が完了するまで停止します。

これは次のようになります。

func = () ->
console.log "Loop started, now wait X seconds"

delay 3000, ->
    console.log "OK, I waited 3 seconds, now lets go on"

delay 1000, ->
    console.log "Cool, I waited another second, now lets go on"
console.log "Ok, nothing to do, lets start again.."
func()

この場合、このループは 4 秒ごとに再起動する必要があります。

4

2 に答える 2

1

コードは次のように構成する必要があると思います。

status = 'nothing'

function loop() {
    if status == 'nothing'

        if next item is image
            show image
            status = 'image'
            countdown = 1000 // time to display the image

        if next item is video
            play video
            videoIsEnded = false
            status = 'video'
            video.onend = function { videoIsEnded = true }

    if status == 'image'
        if countdown-- < 0
            hide image
            status = 'nothing'

    if status == 'video'
        if videoIsEnded
            hide video
            status = 'nothing'
}

setInterval(loop, 1000) // check the status every second
于 2013-02-07T10:26:22.073 に答える
0

無限ループを使用しないでください。

代わりにrequestAnimationFrameを使用します。

    // shim layer with setTimeout fallback
    window.requestAnimFrame = (function(){
      return  window.requestAnimationFrame       || 
              window.webkitRequestAnimationFrame || 
              window.mozRequestAnimationFrame    || 
              window.oRequestAnimationFrame      || 
              window.msRequestAnimationFrame     || 
              function( callback ){
                window.setTimeout(callback, 1000 / 60);
              };
    })();


    // usage: 
    // instead of setInterval(render, 16) ....

    (function animloop(){
      requestAnimFrame(animloop);
      render();
    })();
    // place the rAF *before* the render() to assure as close to 
    // 60fps with the setTimeout fallback.

一時停止するには、タイムスタンプを使用できます。

http://jsfiddle.net/q7qrP/1/

于 2013-02-07T10:26:30.247 に答える