0

我到处寻找解决方案，但找不到任何具体的东西，我知道这是非常可行的，但我认为我缺乏 JavaScript 经验限制了我。基本上我有 5 个 div，每个 div 都像一个按钮。我希望每个按钮都使另一个与 5 个按钮无关的 div 出现。我称它们为“Menubox1/2/3/4”，每一个都链接到每一个。我的第一个想法是将所有菜单堆叠在一起，顶部有一个空白菜单，z-index 为 5。

然后通过在 div 按钮上使用“onclick”方法，我会告诉它获取其各自菜单的元素并将其 z-index 增加到 6，以进入堆栈顶部。我还会告诉它让所有其他菜单转到 4，低于其余菜单。

如此有效地，每个按钮都会使与其关联的菜单出现在具有最高 z-index 的顶部，并隐藏其他菜单框，以便没有其他框位于同一级别。

我找到了一种让它与这个 JS 一起工作的方法

//Shows the current menu on top
  function showstuff(boxid) {
            document.getElementById(boxid).style.zIndex="5";
        }
//Hides the rest of them.
        function hidestuff(boxid) {
            document.getElementById(boxid).style.zindex="3";
        }



<div onclick="showstuff('Menu1'); hidestuff('Menu2'); hidestuff('Menu3');" ;style="cursor:pointer;">

通过将相应的 boxid 放在 "onclick" 中，一切正常，但问题是它只能工作一次，每次单击每个 boxid 时我都需要它工作。

如果有人需要更多信息，我会提供。

4

1 回答 1

1

为什么不只visibility:hidden/visible在要隐藏/显示的窗格上使用？它需要在每次单击时重置每个窗格上的该属性，但您不必担心浏览器如何呈现 z-index，或者在渲染中是否有任何时候您会得到一个奇怪的显示多个 div 渲染时只有一个应该。

于 2012-09-10T15:09:55.747 回答