I'm using JQuery on a navigational panel that operates as click to show/hide. On the "About" panel is small html5 video that I would like to auto start on click-show and stop video on click-hide. The id for the "About" panel is:
<div class="panel2">
Sample code for how the panels function:
$(document).ready(function(){
$(".triggerso").click(function(){
$(this).hide();
$(".panelso开发者_StackOverflow社区").show("fast");
$('.panelso').click(function(){
$(this).hide();
$('.triggerso').show("fast"); });
$(".panel").hide("slow");
$(".panel1").hide("slow");
$(".panel2").hide("slow");
$(".panel3").hide("slow");
return false;
});
});
Thanks you so much for your help.
Andrea
See this:
http://www.w3.org/TR/html5/video.html#video
and the controls attribute:
http://www.w3.org/TR/html5/video.html#attr-media-controls
probably the media methods ".play()" and ".pause()" will help you
Something like this:
var video = $("#myvideo")[0]; // id or class of your <video> tag
if (video.paused) {
video.play();
}
the "[0]" is to get the html element instead of a jQuery object.
精彩评论