带有Fancybox的HTML5视频 [英] HTML5 Video with Fancybox

问题描述

我遇到了将HTML5视频加载到Fancybox时自动播放的问题。
我将HTML5视频加载到隐藏的div中，因此无法在标记中启用自动播放。然后我称它为一个图像点击与Fancybox内联和ref为div。
除了Fancybox打开它之外我只想要播放视频，一切正常吗？任何想法都将不胜感激。

I am having an issue with getting HTML5 video to autoplay on load into Fancybox. I have an HTML5 video loaded into a div that is hidden and therefore can't have autoplay enabled in the tag. I then call it one an image click with a Fancybox inline and a ref to the div. Everything works as it should except I just want the video to play when then Fancybox opens it?? Any ideas would be appreciated.

推荐答案

您可以在fancybox中打开视频后立即自动播放视频。内联视频的问题在于，如果你关闭它然后它会暂停，下次你在fancybox中打开它时，视频将在关闭时在同一个地方/轨道上打开......它不会自动恢复（动作在开始时自动播放）。

You can autoplay the video as soon as it is opened in fancybox. The problem with the inline video is that if you close it then it will pause and the next time you open it in fancybox, the video will be open in the same place/track it was when closed ... and it won't "auto-resume" (the action is autoplay on start).

无论如何，这个选项应该可以解决问题：

Anyway, this option should do the trick:

'onComplete': function(){
$("#myVideo").find('video').attr('autoplay','autoplay');
}

#myVideo 是DIV的ID，其中包含视频标记。

#myVideo is the ID of the DIV, which contains the video tag.

由于您使用的是内联方法，因此有必要查看一个现有错误及其解决方法< a href =http://groups.google.com/group/fancybox/browse_thread/thread/fab7b6d81a173b33/\"rel =nofollow>此处。

Since you are using the inline method, it would worth to have a look at one existing bug and its workaround here.

最后，您可能更愿意使用API​​选项内容，以避免内联类型问题：

Eventually, you may prefer to use the API option 'content' instead, to avoid the inline type issues:

'content': '<video autoplay="autoplay" preload="none" poster="path/image.jpg" width="640" height="360" controls="controls"><source autoplay="autoplay" src="path/video.ogg" type="video/ogg">your browser does not support the HTML 5 video tag</video>'

这篇关于带有Fancybox的HTML5视频的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！