当鼠标移出< li>时，CSS下拉菜单消失。 [英] CSS dropdown menu disappears when mouse moves off of <li>

问题描述

我有问题，我不能保持我的子菜单可见。当我将鼠标悬停在父< li> 上时，会出现，然后当我向下移动以选择其中一个子菜单项时，它会消失。这是一旦父母失去了重点< li>

I have the problem whereby I can't keep my sub menu visible. When I hover over the parent <li> it appears, and then when I move down to select one of the sub menu items it disappears. This is as soon as focus is lost from the parent <li>

我找不到解决方案

有人可以检查吗？

http://www.mymediaventure.com/about.php 。它位于定价标签下。这是令人沮丧的。其他例子我看起来似乎工作，我不能发现任何明显的差异，将暗示为什么他们的工作，我的不。

http://www.mymediaventure.com/about.php. It is under the Pricing tab. This is so frustrating. other examples I look at seem to work and I can't spot any clear differences that would hint why theirs works and mine doesn't.

提前感谢。 p>

Thanks in advance.

推荐答案

问题出现在 styles.css code> #main_content h1 标题元素与 div＃primary_navigation 重叠。您可以通过在导航元素上设置较高的z-index来修复它，如下面的示例所示。

The problem is in styles.css and has to do with your #main_content h1 title element overlapping your div#primary_navigation. You can fix it by setting a higher z-index on your navigation element as I've done in the example below.

#wrapper #top #right div#primary_navigation
{
    position : relative;
    z-index: 2;
    font-size : 11pt;
    margin-top : 72px;

}

>

And a little further down in the CSS:

#main_content h1
{
    position : relative;
    z-index: 1;
    top : -20px;
    font-weight : normal;
}

如果您想直观地看到问题， code> #main_content h1 ，您会发现它几乎完全与您的标签重叠。因此，当您将鼠标悬停在定价标签的顶部时，您可以触发下拉菜单，但是当您向下移动到子项目时，鼠标会移动到标题上，菜单就会消失。

If you want to visually see the problem, add a background colour to your #main_content h1 and you'll notice it almost completely overlaps your tabs. As a result you can trigger the dropdown when you hover over the top of the Pricing tab, but as you move down to the sub items, your mouse goes over the title and the menu disappears.

这篇关于当鼠标移出< li>时，CSS下拉菜单消失。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！