Question

我想出了一种新的方式来做我的清单，但我遇到了一些问题...... 这是代码： http://jsfiddle.net/mstngsal67/GuE99/5/ 我试图理解为什么左键菜单项在点击时只保留粗体，如果我将鼠标悬停在它上面...如果我离开，它会改变回来。我在css中尝试了很多不同的东西，但没有任何工作......我需要在js中这样做吗？这是我的代码的一部分，但去jsfiddle有一切......

<ul class="mainMenus"> 
<li onclick='showSubMenu("sm_item1")'>education 
      <ul class="subMenus" id="sm_item1" style="top:0px"> 
             <li><a href="careers.html"class="text7">careers</a></li> 
             <li><a href="careers.html"class="text7">careers</a></li> 
             <li><a href="careers.html"class="text7">careers</a></li> 
             <li><a href="careers.html"class="text7">careers</a></li> 
      </ul>

提前感谢！

Answer 1

你可以创建另一个CSS类，并在li元素处于活动状态时打开和关闭它（使用jQuery）。

试试看这里：

change active li when clicking a link jquery

Answer 2

顶级列表项（例如“教育”）由于此行而悬停时显示为粗体：

.mainMenus li:hover { 
    font-size: 14px;
    font-weight: bold;
    color: #5e883c;
    font-family: arial;
}

是否单击列表项无关紧要 - 只要鼠标悬停在元素上，它就会保持绿色和粗体。此外，由于您的子菜单位于顶级列表项中，当您将鼠标悬停在子菜单上时，您也会将鼠标悬停在顶级列表项上。

如果您希望顶级列表项在单击后变为粗体，则需要在showSubMenu函数的顶级列表项中添加类名。

jquery列表，保持活动突出显示

2 个答案: