CSS隐藏Youtube视频无法在IE中运行

时间:2010-04-20 16:57:29

标签: jquery css video youtube embedding

我有像这样的youtube视频...

<object id="video_1" class="a_video .......

但是a_video的css:

display:none;

没有将其隐藏在IE中。

任何人都知道如何在IE中隐藏嵌入式YouTube视频?

2 个答案:

答案 0 :(得分:1)

如果我没记错的话,我以前也遇到过这个问题。虽然我的视频会停止显示,但我可以听到它继续在后台播放。我使用的解决方案是将其完全移除并在需要时返回。

像这样:

(function($){
  $(function(){
    var videoCode = $('object').parent().html();
    $('#toggleButton').bind('click',function(e){
      if($('object').length) {
       $('object').remove(); 
      } else {
       $("#container").append(videoCode); 
      }
    });
  });
})(jQuery);​

这个函数做了一些事情......首先,它将与视频(对象)相关的HTML代码设置为变量,以便它能够记住它。然后,它给一个按钮显示/隐藏视频的能力(我假设这是预期的行为)。因此,当单击该按钮时,它会检查视频当前是否在页面中,如果是,则将其从DOM中删除,如果不是,则获取存储的HTML并将其重新应用于视频容器

以下是与之相关的HTML:

  <div id="container">
    <object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/hQVTIJBZook&hl=en_US&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/hQVTIJBZook&hl=en_US&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>
  </div>
  <a href="#" id="toggleButton">Toggle Video</a>

答案 1 :(得分:0)

我看过IE8的这个bug。如果你指向溢出:隐藏在有问题的块元素,这应该可以解决问题。您可能需要将Youtube嵌入代码放在某些内容中。