Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to apply onEnded event for HTML video tag
    primarykey
    data
    text
    <p>I have tried the video tag with flowplayer. The code is given below:</p> <pre><code>&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"&gt; &lt;/script&gt; &lt;!-- 2. flowplayer --&gt; &lt;script src="http://releases.flowplayer.org/5.4.0/flowplayer.min.js"&gt;&lt;/script&gt; &lt;!-- 3. skin --&gt; &lt;link rel="stylesheet" type="text/css" href="http://releases.flowplayer.org/5.4.0/skin/minimalist.css" /&gt; &lt;div class="player" data-engine="flash" style="position: absolute; top: 0px; left: 0px; width: 200px; height: 150px; " &gt; &lt;video preload="none" poster="images.jpeg" id="vid"&gt; &lt;source type="video/webm" src="file4.webm"/&gt; &lt;source type="video/mp4" src="file2.mp4"/&gt; &lt;source type="video/ogg" src="file2.ogv"/&gt; &lt;/video&gt; &lt;/div&gt; &lt;script&gt; // run script after document is ready $(function () { // install flowplayer to an element with CSS class "player" var player= $(".player").flowplayer({ swf: "flowplayer-5.4.0.swf" }); }); player.load(function() { alert("player was loaded programmatically"); }); &lt;/script&gt; </code></pre> <p>How can I redirect the page to <a href="http://google.com" rel="nofollow">http://google.com</a> if the video is finished? How can I fire a ended event for detecting the video end? Thanks in advance!</p> <p>UPDATE </p> <pre><code> &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"&gt;&lt;/script&gt; &lt;script src="http://releases.flowplayer.org/5.4.0/flowplayer.min.js"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; // Master function, encapsulates all functions function init() { var video = document.getElementById("vid"); video.onended = function(e) { alert('ok'); // code to navigate page } } &lt;/script&gt; &lt;script&gt; $(function () { // install flowplayer to an element with CSS class "player" var player= $(".player").flowplayer({ swf: "flowplayer-5.4.0.swf" }); }); &lt;/script&gt; &lt;a class="player" data-engine="flash" style="position: absolute; top: 0px; left: 0px; width: 200px; height: 150px; " &gt; &lt;video preload="none" poster="images.jpeg" id="vid"&gt; &lt;source type="video/webm" src="file4.webm"/&gt; &lt;source type="video/mp4" src="file2.mp4"/&gt; &lt;source type="video/ogg" src="file2.ogv"/&gt; &lt;/video&gt; &lt;/a&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload