视频自动播放显示无div

时间:2012-08-31 08:13:20

标签: google-chrome iframe fancybox

我有一个iframe视频需要在fancybox中播放。 这是代码:

<a id="playLink" href="#pageVideo">Link for video   </a>

    <div style="display:none">
      <div id="pageVideo">
       <iframe src="someVideo.mp4?autoplay=true" style="overflow:auto" frameborder="0" height="400" width="650"></iframe></div>
    </div>

$('#homePlayLink').fancybox({
    'padding' : 0,
    'width' : 560,
    'height' : 400        
}); 

问题是Chrome视频开始在页面加载时播放。因为它显示没有div我看不到它,但我听到了音频。如何解决这个问题,所以视频只能在花哨的盒子里播放后点击链接?

感谢。

1 个答案:

答案 0 :(得分:1)

你的iframe src有autoplay = true参数;这就是为什么它会在页面加载时自动播放。

如何将iframe src指向空白页面,然后在fancybox打开时覆盖href?

$("#tip4").click(function() {
  $.fancybox({
        'padding'       : 0,
        'autoScale'     : false,
        'transitionIn'  : 'none',
        'transitionOut' : 'none',
        'title'         : this.title,
        'width'     : 680,
        'height'        : 495,
        'href'          : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
        'type'          : 'swf',
        'swf'           : {
             'wmode'        : 'transparent',
            'allowfullscreen'   : 'true'
        }
  });
  return false;
});

查看http://fancybox.net/blog第4部分:显示youtube剪辑。