<iframe>视频嵌入重叠模式

Question

我的网站上有一个页面，我嵌入了 twitch.tv 的直播，我遇到了一些问题实时流重叠不应该的内容。如果用户尝试在该页面上登录或注册，则嵌入的视频将自身置于打开的模式/对话框的顶部。模态是使用Bootstrap 3创建的。

＆＃xA;＆＃xA;

它看起来像这样：＆＃xA;

＆＃xA;＆＃xA;

iframe嵌入如下所示：

＆＃xA;＆＃xA;

 < code> iframe src =“https://www-cdn.jtvnw.net/swflibs/TwitchPlayer.swf?channel=imaqtpie”frameborder =“0”＆＃xA;  

＆＃xA;＆ #xA;

任何人都知道解决方案吗？

＆＃xA;

Answer 1

您可能会查看CSS z-index属性。

你可以按照你想要的顺序手动设置它们，但要注意来自boostrap类模式的任何重叠的css。

虽然我认为只是视频需要较低的z-index，因为模态通常会给出较高的值。 例如

<iframe style='z-index:0' ...

有关此帖子的更多信息：how to control div overlapping in html

有趣的教程，如果你有时间：http://webdesign.tutsplus.com/articles/what-you-may-not-know-about-the-z-index-property--webdesign-16892