javascript - How to allow rewind but disable fast-forwarding in html5-video -
i have following code (using videojs)
this.on("timeupdate", function(event) { previoustime = this.currenttime(); }); this.on("seeking", function(){ if (this.currenttime() > previoustime){ this.currenttime = previoustime; } });
problem that, once try fast-forward 1 time, no longers keeps track of timeupdate on progress bar. can not longer seek on bar - not rewind video. missing here?
first off, these not standard htmlmediaelement methods , properties, i'm assuming you're using kind of framework, perhaps popcorn.js? , i'm assuming this
refers object wrapping video element.
the problem you're overwriting currenttime
method. if reference video element directly, seek way you're doing it, setting currenttime
property, like: videoelement.currenttime = previoustime
. since you're using framework, this.currenttime
supposed function until change number.
to demonstrate, modify code follows:
this.on("seeking", function(){ console.log(typeof this.currenttime); // 'function' if (this.currenttime() > previoustime){ this.currenttime = previoustime; console.log(typeof this.currenttime); // 'number' } });
the next time run "timeupdate" handler, call this.currenttime()
throw error because no longer function.
you can fix (assuming you're using popcorn or works similarly):
this.on("seeking", function(){ if (this.currenttime() > previoustime){ this.currenttime(previoustime); } });
you'll want make sure don't set previoustime
while seeking, since "timeupdate" may fire before "seeking" does. i'm not sure how framework, here's link working example using native htmlvideoelement api:
Comments
Post a Comment