Javascript jQuery菜单按钮仅在webkit中的下拉菜单中消失，如何使其保持不变？

我在jQuery下拉列表中遇到了一个问题。基本上，显示下拉列表的按钮在显示下拉列表时消失。这是密码

导航中包含的HTML

<div id="header">
<div id="navHolder">
        <ul style="list-style: none;">
        <li><a href="#" class="navBtn">Travel Blog</a></li>
        <ul class="dropdown">
        <li><a href="#" class="navBtn">Destination</a>
            <ul class="sub_menu">
                 <li><a href="#">Item One</a></li>
                 <li><a href="#">Item Two</a></li>
                 <li><a href="#">Item Three</a></li>
            </ul>
        </li>
        </ul>
    <li><a href="#" class="navBtn">Map</a></li>
    <li><a href="#" class="navBtn">About</a></li>
    </ul>
</div>

}))

这是CSS样式的按钮和下拉

ul.dropdown                         { position: relative; list-style: none;}
ul.dropdown li                      { font-weight: bold;  list-style: none; zoom: 1;}
ul.dropdown a:hover                 { color: #CCC; }
ul.dropdown a:active                { color: #FFF; }
ul.dropdown li a                    { display: block; color: #FFF;}
ul.dropdown li:last-child a         { border-right: none; } /* Doesn't work in IE */
ul.dropdown li.hover,
ul.dropdown li:hover                { color: #CCC; position: relative; }
ul.dropdown li.hover a              { color: #FFF; text-decoration: none;}
ul.dropdown ul                      { width: 180px; background: url(images/transBlack_bg2.png) repeat; -moz-border-radius: 5px; -webkit-border-radius: 5px; visibility: hidden; position: absolute; top: 45px; right: 60px; }
ul.dropdown ul li                   { font-weight: bold; font-size: 13px; color: #FFF; padding: 5px;}
ul.dropdown ul li a                 { width: auto; display: inline-block; } 
ul.dropdown ul li a:hover           { color: #111;}
ul.dropdown ul ul                   { left: 100%; top: 0; }
ul.dropdown li:hover > ul           { visibility: visible; }

---

任何建议或答案都将不胜感激，非常感谢您的时间：）

问题是您错误地使用了伪悬停类。指定如何正确使用它们。您的问题是（来自链接）：注意：在CSS定义中，a:link和a:visted之后必须加上a:hover才能生效！！因此，您的悬停样式行为不正确。如果添加这些行（根据需要进行调整）：

在这一行之前：

ul.dropdown li.hover a              { color: #FFF; text-decoration: none;} 

它将按预期工作

---

编辑：另外，使用名为hover的类和hover伪类会使css很难破译。如果可能的话，我会给你创建的类起一个不同的名字

问题是您使用的伪hover类不正确。指定如何正确使用它们。您的问题是（来自链接）：注意：在CSS定义中，a:link和a:visted之后必须加上a:hover才能生效！！因此，您的悬停样式行为不正确。如果添加这些行（根据需要进行调整）：

在这一行之前：

ul.dropdown li.hover a              { color: #FFF; text-decoration: none;} 

它将按预期工作

---

编辑：另外，使用名为hover的类和hover伪类会使css很难破译。如果可能的话，我会给你创建的类起一个不同的名字

不，这没用，不过还是要谢谢你的帮助：）最后我发现这是一个漂流的浮子。。。这使得内容显示在页面外…花了很长时间才找到，但现在就完成了，谢谢你的知识，这非常有帮助，我以前不知道（我只有18 lol）谢谢这不起作用，尽管无论如何谢谢你的帮助：）最后我发现这是一个游离的浮动。。。这是使内容显示的网页…花了很长时间才找到，但它现在完成了，谢谢你的知识，这是非常有帮助的，我以前不知道（我只有18 lol）谢谢

ul.dropdown li.hover a              { color: #FFF; text-decoration: none;}