为什么将我的 div 位置设置为固定会干扰浮出控件 div

Question

我有这个小提琴：https://jsfiddle.net/reko91/yg0rs4xc/13/

请注意，单击按钮并显示浮出控件时，无法单击任何内容。执行此操作时，浮出控件将消失。

这是工作小提琴： https://jsfiddle.net/reko91/yg0rs4xc/14/

这是因为我将wholeContainerdiv的位置从fixed更改为absolute.

有人可以解释为什么会这样吗？

Answer 1

将元素设置为position:fixed元素将相对于文档，而不是相对于其父级。这意味着，如果您希望元素正常运行，则必须添加 z 索引。

https://jsfiddle.net/yg0rs4xc/15/

当它是绝对的时，它是相对于它的父级的，所以没有必要添加 z 索引。