javascript - HTML5 Video - position of clicks -


okay, want user able click on particular area of video , x happens, otherwise nothing happens, pure javascript, not jquery...

i've got:

document.getelementbyid('videoele').addeventlistener('click',handleclick,false); function handleclick() { if(video.currenttime > 24.5 && video.currenttime < 29)     {         console.log("good timed click: " + video.currenttime);     } else {         console.log(video.currenttime);     } } 

there's things intend change src of video if click in right time , right position, can't find on positional clicking on html5 video element. possible yet?

i using customised buttons, not should make difference.

thanks in advance!

try using this:

videoelement = document.getelementbyid("videoele"); videoelement.addeventlistener("mousedown", handleclick, false); handleclick = function(e) {     if(videoelement.currenttime > 24.5 && videoelement.currenttime < 29) {         console.log("good timed click: " + videoelement.currenttime);     } else {         console.log(videoelement.currenttime);     }     console.log("mouse-x: " + (e.clientx + window.pagexoffset));     console.log("mouse-y: " + (e.clienty + window.pageyoffset));     e.preventdefault(); } 

note mouseevent (e).clientx , clienty give x , y coordinates of mouse relative window without taking scrolling account. fix this, have add window.pagexoffset , window.pageyoffset. window.pagexoffset , window.pageyoffset not supported in old versions of ie, however. e.preventdefault() there prevent video pausing when click it.


Comments

Popular posts from this blog

PHPMotion implementation - URL based videos (Hosted on separate location) -

javascript - Using Windows Media Player as video fallback for video tag -

c# - Unity IoC Lifetime per HttpRequest for UserStore -