Javascript 模态叠加是否需要绝对定位？

以下是我所说的内容：

“我的覆盖图”显示已禁用链接，但链接仍然可以单击。我浏览了一些模态对话框窗口的示例，希望找到一个解决方案。据我所知，我需要使用绝对定位

---

我犹豫是否这样做，因为实际上我的内容是动态填充的。似乎需要做很多额外的工作来保持覆盖层的正确尺寸——我真的很喜欢它现在的样子，我只想在覆盖层是父对象时使控件不可访问。这可能吗？

在您的示例中，您的覆盖div中似乎有您试图禁用的内容。为了使其正常工作，您需要将覆盖div置于内容之上，因此将其置于内容之后。这样它就掩盖了你的内容

是的，您的覆盖应该具有绝对定位，以便将其放置在父容器的右上角，并为其提供100%的宽度和高度，以便覆盖整个父容器

有关示例，请参见

---

编辑：

试试看。将内容物和覆盖物放在一个容器中。这样，覆盖将只占用页面的该部分

---

请注意，容器div（

divLink1

和

divLink2

）必须具有

位置：relative

，才能工作。根据中的

absolute

描述，“元素相对于其第一个定位（非静态）的祖先元素进行定位。”因此，您必须将容器设置为

position:relative

，但实际上不要移动它们。

您的示例对我来说似乎很好。当我点击“显示覆盖”链接，弹出窗口出现后，我不能再点击“显示覆盖”，直到我关闭弹出窗口。JS fiddle给了我错误的链接——这是我在看的一个例子，废话。等一下。编辑：现在已修复。这是一个非常简单的例子。是的，我完全理解这个概念。这是令人沮丧的，因为我试图隐藏的内容的复杂性/位置。内容可以在ajax调用后扩展/收缩，我担心我的覆盖在扩展后恢复内容时会看起来像是在“追赶”。请注意，您的JSFIDLE不会使链接看起来被禁用——您已经失去了该功能。相反，它会禁用单击链接，但不会使其淡出，但它似乎只是一个不透明度设置。