Question

我的活动链接上悬停状态有一条双红线（下拉菜单上会出现另一条红线。如何解决此问题。另外当我继续进行dpopdown菜单时，活动状态消失。 JSFIDDLE

Thank you.
Have a nice day.

[1]: http://jsfiddle.net/uj5k5ecq/

Answer 1

一种选择是通过将此添加到您的CSS来删除悬停下划线：

#nav a:hover{text-decoration:none;}

另一个选项是通过删除border-top: 5px solid #eb2629;将鼠标悬停在下拉列表上时删除红色边框。示例如下：

.jqueryslidemenu ul li ul {
position: absolute;
left: 0;
margin-left: -1px;  
border-top: 5px solid #eb2629; /** REMOVE THIS LINE **/
display: block;
visibility: hidden;
background: #000;
z-index: 99999;
}

第三个选项是当您将鼠标悬停在链接本身上时删除活动的红色边框：

.jqueryslidemenu ul li a.active {
border-bottom: 5px solid #eb2629; /** REMOVE THIS LINE **/
color: #eb2629; 
}

Answer 2

添加

#nav a {
    text-decoration: none;
}

查看DEMO

Answer 3

你的问题不是很明确，但我想你可能会这样说？

http://jsfiddle.net/uj5k5ecq/3/

#nav {
float: right;
margin-top: 70px;
position: relative;
}
.jqueryslidemenu ul {
z-index:9999999;
}
.jqueryslidemenu ul li {
position: relative;
float: left;
list-style:none;
}
.jqueryslidemenu ul li a {
font-weight: normal;
text-transform: uppercase;
font-size: 13px;
margin-top: 18px;
padding: 0px 20px 15px;
display: block;
text-decoration:none;
color:#000;
}
.jqueryslidemenu ul li a:hover {
border-bottom: 5px solid #eb2629;
color: #eb2629;
}
.jqueryslidemenu ul li a.active {
}
.jqueryslidemenu ul li ul {
position: absolute;
left: 0;
margin-left: -1px;
border-top: 5px solid #eb2629;
display: block;
visibility: hidden;
background: #000;
z-index: 99999;
}
/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li {
float: none;
font-size:12px;
width: 160px;
text-transform: none;
background-color: #000;
}
.jqueryslidemenu ul li ul li a {
margin: 0px;
color:#fff;
padding: 10px 20px 10px;
border-bottom: none;
text-transform: none;
}
.jqueryslidemenu ul li ul li a:hover {
background:#232323;
color: #FFF;
border-bottom: none;
text-transform: none;
}

Answer 4

添加一个新课程.jqueryslidemenu ul li a.active:hover并给它一个border-bottom:0;应该这样做，但是我试图找出的东西是为什么下拉不填充5px从边框底部移除...直到现在我有这个：

.jqueryslidemenu ul li a.active:hover {
    border-bottom:0;
}

========更新==========

我明白了，你的jquery代码（可能在你的文件jqueryslidemenu.js中）中的某个地方有top:56px;下拉列表的静态位置，因为它有一个新的{{1}通过你的CSS这样的top的值会解决这个问题

.jqueryslidemenu ul li ul

在线 demo here
但也许你应该找到那个值并在那里改变它，在那里创建.jqueryslidemenu ul li ul { top: 51px !important; }

如何禁用活动链接上的悬停状态

4 个答案: