currentTime が >=2 のときにビデオを一時停止したいのですが、問題があります。白い div をクリックすると、ビデオが変わり、そのビデオが 2 秒で一時停止するようにします。しかし、フィドルでわかるように、最初のビデオも2秒で一時停止しますが、それは望ましくありません。イベントハンドラ関数を、最初のビデオではなく 2 番目のビデオでのみ機能させたいです。
HTML
<video src="videos/loop.webm" id="video" width="100%" autoplay>
</video>
JS
//This code tracks currentTime
$("#video").on(
"timeupdate",
function(event){
onTrackedVideoFrame(this.currentTime);
});
});
function onTrackedVideoFrame(currentTime){
$("#current").text(currentTime);
}
video.addEventListener("timeupdate", function() {
if (this.currentTime >= 2.000 && this.currentTime <= 8.000) {
this.pause();
}
}, false);
//This code tracks currentTime
//this code changes video source
var videoSource = new Array();
videoSource[0]='videos/loop.webm';
videoSource[1]='videos/fullcut.webm';
var videoCount = videoSource.length;
function videoPlay(videoNum)
{
var video = document.getElementById('video');
video.setAttribute("src",videoSource[videoNum]);
video.load();
video.play();
}
//this code changes video source
これがフィドルです:http://jsfiddle.net/fKfgp/22/
読んでくれてありがとう!