CSS 隐藏 Youtube 视频在 IE 中不起作用

发布于 2024-08-29 17:55:22 字数 228 浏览 4 评论 0原文

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

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

但是 a_video: 的 css

display:none;

并没有隐藏在 IE 中。

有人知道如何在 IE 中隐藏嵌入的 YouTube 视频吗？

原文

I have a youtube video like so...

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

However the css for a_video:

display:none;

Isn't hiding it in IE.

Anyone know how to hide embedded youtube videos in IE?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

嘿咻 2024-09-05 17:55:22

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

像这样：

(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>

If I remember correctly, I also had this problem before. Though my video would stop displaying, but I could hear it continuing to play in the background. The solution I used was to remove it completely and return it when needed.

Like this:

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

This function does a few things... first, it sets the HTML code associated to the video (the object) into a variable so it can remember it. Then, it gives a button the ability to show / hide the video (I'm assuming that is the intended behavior). So, when the button is clicked, it checks to see if a video is currently in the page, if it is, it removes it from the DOM, and if it isn't, and takes the stored HTML and reapplies it to the video's container.

Here's the HTML that went with that:

  <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>

回复收藏 0 原文