Detect if HTML5 Video element is playing Detect if HTML5 Video element is playing javascript javascript

Detect if HTML5 Video element is playing


It seems to me like you could just check for !stream.paused.


My answer at How to tell if a <video> element is currently playing?:

MediaElement does not have a property that tells about if its playing or not. But you could define a custom property for it.

Object.defineProperty(HTMLMediaElement.prototype, 'playing', {    get: function(){        return !!(this.currentTime > 0 && !this.paused && !this.ended && this.readyState > 2);    }})

Now you can use it on video or audio elements like this:

if(document.querySelector('video').playing){    // Do anything you want to}


Note : This answer was given in 2011. Please check the updated documentation on HTML5 video before proceeding.

If you just want to know whether the video is paused, use the flag stream.paused.

There is no property for video element for getting the playing status. But there is one event "playing" which will be triggered when it starts to play. Event "ended" is triggered when it stops playing.

So the solution is

  1. decalre one variable videoStatus
  2. add event handlers for different events of video
  3. update videoStatus using the event handlers
  4. use videoStatus to identify the status of the video

This page will give you a better idea about video events. Play the video on this page and see how events are triggered.
http://www.w3.org/2010/05/video/mediaevents.html