Media Events jQuery

A common thing to want to do is respond to the state of some media (audio of video) playing on your page. You can “hook” into a number of events on the media object, like when the video is playing, when it is paused, even find out the current time of the video.

However, we’ll start by looking at probably the most common scenario, which is to do something when a video (or audio) comes to a stop, the is the “ended” event.

We’ll first set up a simple video in our HTML. Most importantly, we need to give it an id attribute. Here, I’ve called it “myVideo”:

 

Note: As always we’ll be working inside our $(document).ready() runction. 

This is an incredibly useful resource for finding all the events and information you can extract from a media object: https://www.w3.org/2010/05/video/mediaevents.html