0

I'm trying to make an image appear when the video reaches the end but it's not working and for now I have this code:

// Change image to video on click(working)
$('#image').click(function() {
  video = '<video id="video" muted autoplay poster="/img.png" controls style="width: 100%; height: auto; z-index: 999999;"><source src="/video.m4v"></video>';
  jQuery(this).replaceWith(video);
});

// Detect end of video(not working)
$('video').on('ended', function() {
   alert("End of te video!");
});

The alert is not popping out, keep in mind that this code works fine on desktop, but not on mobile, any suggestion would be appreciated,

Thanks!

Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
diogoalvesmf
  • 22
  • 1
  • 7

1 Answers1

0

You need to create a new EventListener for the ended events

Example:

video.addEventListener('ended', function(){
    //Your Code goes here
})

success: function (video, domObject) { 

    // add event listener
    YourMediaElement.addEventListener('ended', function(e) {

           //Do Stuff here

    }, false);

i copied the code from the below link checck that for more info...

How to call a function on video end ? (HTML5 and mediaelementjs)

Community
  • 1
  • 1