Play/pause HTML 5 video using JQuery

I am trying to control HTML5 videos using JQuery. I have two clips in a tabbed interface, there are six tabs in total, the others just have images. I am trying to make the video clips play when their tab is clicked and then stop when any of the others are clicked.

This must be a simple thing to do but I cant seem to get it to work, the code I am using to play the video is:

$('#playMovie1').click(function(){
  $('#movie1').play();
      });

I have read that the video element needs to be exposed in a function to be able to control it but can’t find an example. I am able to make it work using JS:

document.getElementById('movie1').play();

Any advice would be great. Thanks

18 Answers
18

Leave a Comment