2017-01-14 8 views
1

私はビデオを再生するために使用しているjsfiddleの内側要素の例を持っており、52秒ごとにそれを繰り返す必要があります。メディア要素を使用してn秒ごとにビデオを再生

これはフィドル

http://jsfiddle.net/codebreaker87/30t50mgc/17/

やビデオでもある52秒後に再び再生されないHTML

<video id="youtube1" width="640" height="360" autoplay="true"></video> 

とjQuery

$(document).ready(function(){ 
    setInterval(function() { 
    var player = new MediaElementPlayer('#youtube1', { 
     type: ['video/webm'], 
     success: function (mediaElement, domObject) { 
      var sources = [ 
       { src: "http://corrupt-system.de/assets/media/sintel/sintel-trailer.webm", type: 'video/webm' }, 
]; 
      mediaElement.setSrc(sources); 
      mediaElement.load(); 
      mediaElement.play(); 
     } 
    }); 
}, 52000); 
}); 

です動画の長さ

答えて

1

あなたはこれを必要以上に複雑にしています。 video要素の再生が終了すると、endedイベントが発生します。そのイベントにフックしてから、play()を呼び出してビデオの再生を再開することができます。これにより、コード作成がはるかに簡単になるという利点がありますが、ユーザーが前後のビデオをスキップする場合にも機能します。あなたの現在の方法では、タイマーは非常に簡単にビデオ状態との同期を得ることができます。あなたは、このコードのプレイ動画ごとに2秒を使用することができます

var player = new MediaElementPlayer('#youtube1', { 
 
    type: ['video/webm'], 
 
    success: function(mediaElement, domObject) { 
 
    var sources = [{ 
 
     src: "http://corrupt-system.de/assets/media/sintel/sintel-trailer.webm", 
 
     type: 'video/webm' 
 
    }]; 
 
    mediaElement.setSrc(sources); 
 
    mediaElement.load(); 
 
    mediaElement.play(); 
 

 
    mediaElement.addEventListener('ended', function() { 
 
     this.play(); 
 
    }) 
 
    } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/mediaelement/2.13.2/css/mediaelementplayer.min.css" /> 
 
<script src="http://cdnjs.cloudflare.com/ajax/libs/mediaelement/2.13.2/js/mediaelement-and-player.min.js"></script> 
 
<video id="youtube1" width="640" height="360" autoplay="true"></video>

+0

私はhttp://jsfiddle.net/codebreaker87/30t50mgc/20/のようにビデオを切り替えることができますが、5秒後に別のビデオを再生するにはどうすればいいですか? –

0

:これを試してみてください。

vplayer = new MediaElementPlayer('video'); 
    // check if paused 

    setInterval(function(){ 
        var classList = $('.mejs-playpause-button').attr("class").split(' '); 
        for (var i = 0; i < classList.length; i++) { 
         if (classList[i] === 'mejs-play') { 
          vplayer.play(); 
         } 
        } 
      },2000); 


     // without check paused 
     setInterval(function(){ 
     vplayer.play(); 
    },2000); 
関連する問題