I am using video tag on my website. It works with every major browser, but I am running into issues with Firefox.
When I tap on the play button video scrolls to the end of video!
In order to start the video I need to rewind video to position other than start and than click on play. Weird. I tried to set initial position of video to 1s but it didn't help. I still need to scroll it manually. Any help will be appreciated. Thank you
<video width="80% height="80%" controls id="video1">
<source src="videos/<cfoutput>#getVideo.URL#</cfoutput>.mp4" type="video/mp4">
<source src="videos/<cfoutput>#getVideo.URL#</cfoutput>.ogv" type="video/ogg">
<source src="videos/<cfoutput>#getVideo.URL#</cfoutput>.webmhd.webm" type="video/webm">
Your browser does not support the video tag.
</video>
Javascript:
V I D E O */
function setupVideo(){ if(!myVideo){ console.log("Setting up video"); myVideo=document.getElementById("video1"); timeElapsed = 0; timer;
myVideo.addEventListener("play",videoStarted,false);
myVideo.addEventListener("pause",videoPaused,false);
myVideo.addEventListener("loadeddata",videoLoaded,false);
console.log(" Video Element is: "+myVideo);
}
else{
console.log("Video Was Already set");
playPause();
}
}
function playPause() { if (myVideo.paused) myVideo.play(); else myVideo.pause(); }
function videoLoaded(e) { console.log(" Video Loaded "); myVideo.currentTime = 1; }
function videoStarted(e) { console.log("Video Started"); //start the timer timer = setInterval(videoPlaying,1000); }
function videoPlaying(){ timeElapsed ++; console.log("Video Playing "+myVideo.currentTime);
if(Math.ceil(myVideo.currentTime)== 10)
{
console.log(" it reached 10 now display quiz");
playPause();
}
}
function videoPaused(e) { clearInterval(timer); console.log("Pause"); }
Your WebM or OGV video may have negative or invalid timestamps. Some software produces video that starts at a time slightly less than zero, particularly if the audio and video frames are not aligned to start at the same time. (That is, the video may start slightly before 0 and the audio may start at 0.)
If the video is produced with ffmpeg
, try using the option -avoid_negative_ts 1
.
If you have the mkvtoolnix package installed you can view the timestamps in a webm file with the command mkvinfo -s
file.webm.