html - 如何停止嵌入的视频与固定位置标题重叠

Question

我在带有固定标题的页面上嵌入了几个 YouTube 视频，滚动时它们会重叠。我对任何其他内容都没有这个问题。

我已经尝试过 zindex，但它不适用于 position:fixed 元素。我也试过在嵌入标签中输入 wmode:transparent 但这也没有用

任何帮助将不胜感激

Answer 1

尝试将 &wmode=transparent 附加到您的 YouTube 网址的末尾。看看是否有帮助。

** 编辑:

使用 ?wmode=transparent 或 &wmode=transparent(如果现有的 url 已经有名称/值参数并且已经包含 '?')。如果这不能解决问题，请尝试此 jQuery 代码:

<script>
$(document).ready(function(){
   $('iframe').each(function(){
      var url = $(this).attr("src");
      if(url.indexOf("?")>0){
         $(this).attr("src",url+"&wmode=transparent")
      }else{
         $(this).attr("src",url+"?wmode=transparent")
      }
   });
});
</script>

注意:jQuery 脚本是本网站上建议的稍微修改的版本:http://www.scorchsoft.com/news/youtube-z-index-embed-iframe-fix