Detecting HTML5 video play/pause state with jQuery

Question

I'm building a jQuery slideshow which will feature an HTML5 video player on one of the slides. Is there any way to get the jQuery slideshow to pause from its otherwise automatically running state, when it detects that the video is playing, besides a "slideshow play/pause" button?

Solution 1

You can check if the video is paused used the paused property:

$("#videoID").get(0).paused;

You can pause a video using the pause() method:

$("#videoID").get(0).pause();

You can then resume the playback of the video using the play() method:

$("#videoID").get(0).play();

Solution 2

var video = $('video');

var videoElement = video.get(0);

if (!videoElement.paused) {} 

One way of doing it using Jquery