强制将固定导航栏固定在 iframe 顶部

Question

我把导航固定在页面顶部，但如果将嵌入iframe的YouTube视频滚动到上面，它就会显示在导航的顶部（以及任何叠加层或模态窗口div）。

尝试在其上设置z索引，但无济于事。

我发现您可以在嵌入对象上设置 wmode="opaque" 以使其与旧式 Flash 嵌入一起使用，但我更喜欢使用 HTML 5，而不必对视频嵌入进行特定设置

http://jsfiddle.net/EB6gN/9/

Answer 1

正确答案是将 wmode=opaque 设置为 iframe src 值的 YouTube 查询字符串。

iframe 没有属性不透明。允许属性的完整列表如下：http://www.w3schools.com/tags/tag_iframe.asp

这个更新的jsfiddle只包含HTML5 API Embed YouTube方法，省略了旧式的嵌入类型和你不需要的z-index.
http://jsfiddle.net/EB6gN/16/

如果您点击播放视频看到黑屏，这是因为当前的YouTube HTML5 Flash回退错误。一旦 iframe 较大，您将看到控件，但播放器已损坏。参考这个SO帖子的信息：
https://stackoverflow.com/a/10560802/1195891

Answer 2

JSFiddle

您需要将帧的模式设置为不透明或透明。您还需要将该参数添加到 iframe 中的 youtube 视频中。

更多关于 wmode.

编辑：将所有内容设置为不透明效果很好，至少在Chrome中是这样。