使用Fancybox调出video-js iframe问题

时间:2014-11-16 12:45:56

标签: javascript html iframe fancybox

好的,所以我尝试使用Fancybox在点击图片横幅时显示一个包含视频的iframe。经过各种尝试并经历了大量的文档记录,到目前为止我唯一能做的就是让自己哭泣。在点击图像的那一刻,你将拍摄到fluvid.html并且视频全屏显示。我在想我需要另外关注我的代码。我在这里缺少什么?
在标题中:

<script type="text/javascript">
$(document).ready(function() {
$(".various").fancybox({
    maxWidth    : 640,
    maxHeight   : 360,
    fitToView   : false,
    width       : '70%',
    height      : '70%',
    autoSize    : false,
    closeClick  : true,
    openEffect  : 'none',
    closeEffect : 'none'
});
});
</script>

图片代码:

<div class="flubanner"><a class="various" data-fancybox-type="iframe" href="fluvid.html"><img src="images/flubanner.png" height="200px" width="980px"/></a></div>

fluvid.html

<div class="video-js-box">
<!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody -->
<video id="fluvid" class="video-js" width="640px" height="360px" controls="controls" preload="auto" autoplay poster="images/image.jpg">
  <source src="images/fluvid.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
     <!-- Image Fallback. Typically the same as the poster image. -->
    <img src="images/image.jpg" width="640" height="360" alt="Poster Image"
  title="No video playback capabilities." />
</video>

0 个答案:

没有答案