How to set currentTime in popcorn.js when a link is clicked?

227 views Asked by At

What I am trying to do is to get popcorn.js to jump to a point in the video when a link is clicked. I tried using the below function, currentTime() but am unable to add the on click button to trigger the function. http://popcornjs.org/popcorn-docs/media-methods/#currentTime

For the html side this is what I have.

<video height="180" width="300" id="video" controls> 
<source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.mp4">     </source>
<source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.ogv">  </source>
<source    src="http://videos.mozilla.org/serv/webmademovies/popcornplug.webm"></source>
</video>
<div id="footnotediv"></div>
<p id="click">Click me.</p>

This is what I have tried for the .js side

// create a popcorn instance
var $pop = Popcorn("#video");

// on click , switch the time back to 3 second
$pop.exec( document.getElementById("click").onclick, function() {
    this.currentTime( 3 );
});

// play the video
$pop.play();

Can anyone help me point to what am I doing wrong? I am still trying to find my feet with this.

1

There are 1 answers

0
Philip Kirkbride On

I think this is a syntax problem try this:

// create a popcorn instance
var $pop = Popcorn("#video");

// on click , switch the time back to 3 second
$pop.exec( document.getElementById("click").onclick, function() {
    $pop.currentTime = 3;
});

// play the video
$pop.play();