jquery - z-index 问题，Mask 结束了视频？

Question

如果您查看此页面，然后单击滑块中的“播放”图标 - 然后在 IE 中，掩码位于整个视频/页面的顶部，但掩码的 z-index 低于打开的 div向上？在 FF 和 Chrome 中，它只是“关闭”按钮，而不是放置在蒙版下方......无法完全弄清楚为什么，因为蒙版的 z-index 低于带有视频的 div ？

Answer 1

您的页面的行为完全符合其应有的行为。

掩码是 body 标签的直接子代，它的 z-index 为 1000。

您的视频是 z-index 为 1 的任何滑块中 li 的直接子级。

因此，即使您的视频本身的 z-index 为 5000，它也位于比您的掩码低（因为 1 低于 1000）的堆叠上下文中，因此会出现在您的掩码后面。

如果可能的话，最好的办法是让包含您的视频的对话框出现在与您的掩码（body 的直接子项）相同的堆叠上下文中（如果可能）。