jPlayer Development : HTML5 Media Event Inspector

HTML5 Media Event Inspector

The mediaEventInspector plugin displays information about the specified media element.
$("#inspector").mediaEventInspector({mediaElement:document.getElementById("media")});

The events are displayed in real-time, as the event occurs. The event is highlighted for a duration of 1 second, and multiple events during the second are indicated by the number in brackets.

The media properties are shown below the events. The properties are updated every time an event occurs, but you can disable this auto-refresh if it is degrading the performance of the event inspector. In that case, use the update control to refresh the information manually.

Audio in page source

Here the Audio media element is written into the original page HTML code and uses <audio> and <source> elements to define the media. The default browser controls are used. The inspector is setup at jQuery ready() so some initial events may not be captured by the inspector.

Video in page source

Here the Video media element is written into the original page HTML code and uses <video> and <source> elements to define the media. The default browser controls are used. The inspector is setup at jQuery ready() so some initial events may not be captured by the inspector.