1

我有一个托管在 blogger.google.com 上的博客。

最近我遇到了一个名为“类别”的下拉菜单的问题。当我将光标移到子元素（子菜单项）上时，它们就会自动消失。我已经尝试过类似问题的其他答案，但在我的情况下它们并没有太大帮助。

当我将鼠标移到它们上方时，我只想让下拉元素保留在它们的位置，以便我可以选择它们。

任何人都可以检查问题吗？

我的网站链接是http://www.techtreck.in

尝试转到“类别”选项卡，您会看到我在说什么。

许多thanx提前..

..希望尽快得到答复！

4

3 回答 3

3

如果您移动鼠标的速度足够快，它就可以工作：P

但看起来这是由于类别和实际下拉菜单之间的差距，当您向下移动鼠标时，它会进入间隙，因此它不再触发 onmouseover 事件，隐藏下拉菜单。

您应该将下拉菜单的位置向上移动，使其与类别按钮完全对齐。

于 2012-08-21T11:31:21.697 回答
3

你的主菜单和子菜单之间有一个隐藏的差距。用firebug检查你的css，我在你的代码中发现了这个：

#top li ul {
    background: none repeat scroll 0 0 #111111;
    margin-top: 20px;
    padding: 5px 0 3px;
    width: 187px;
}

现在margin-top: 20px;离主菜单太远了。所以改成：

#top li ul {
        background: none repeat scroll 0 0 #111111;
        margin-top: 14px;
        padding: 5px 0 3px;
        width: 187px;
    }

它会正常工作。

于 2012-08-21T11:41:34.057 回答
2

主菜单和子菜单之间的差距确实是导致问题的原因。@kakarott 解决方案也是我会做的，它是迄今为止最简单的解决方案。但是，如果设计上存在差距，您仍然可以通过使用 css 来获得所需的结果。这样的事情应该可以解决问题：

  • 去掉sub ul的背景色使其透明
  • 将 sub ul 的边距更改为填充
  • 将 sub li 的边距也更改为填充
  • 在 sub li 上设置 sub ul 上的背景颜色
  • 将 sub ul 上的 padding 添加到 sub li 的相应 padding

（我没有对此进行测试，但如果我没有忘记任何事情，它应该可以解决我认为的问题）

这样做是使嵌套的 ul 透明并与父 li 重叠。这样，当您将鼠标移动到子菜单上时，悬停状态仍然会被触发。视觉上应该没有变化。

于 2012-08-21T12:45:43.070 回答