css - 由于 CSS，JQuery 同级选择器未附加类

Question

我也有一个带有子菜单子(monad)导航的菜单，我正在尝试根据 child <ul> 的悬停将一个类附加到 child 的父级。容器。

这是我目前所拥有的:http://jsfiddle.net/2KhnX/15/

但如您所见，该类永远不会被追加。如果我从 HTML 中去除大部分 CSS，但保留我想要附加的类，它工作正常 - http://jsfiddle.net/2KhnX/21/

这让我相信 CSS 是冲突的或破坏了 JQuery 试图执行的事件。我的猜测是因为我正在使用 parent > child CSS 规则，或者可能是因为 .sub-menu初始属性为 display:none .我不确定，我只知道 CSS 搞砸了，或者我没有使用合适的选择器因为 CSS。

任何见解将不胜感激，因为我迷路了。

Answer 1

这是有问题的 css:

ul.menu li a:link, ul.menu li a:visited {
        background: url('images/alink.jpg') top center repeat-x;
}
.parenthovered {
    /* stuff */
}

那些第一选择器有更高的 specificity比 .parenthovered 选择器，因此优先。您可以通过几种方式解决这个问题；一种方法是对第一组选择器不那么具体，而对第二个选择器更具体:

a:link, a:visited {
        background: url('images/alink.jpg') top center repeat-x;
}

.menu a.parenthovered {
    /* stuff */
}

当然，您必须选择对页面其余部分有意义的选择器...

工作 fiddle :http://jsfiddle.net/pabo/NR4yB/1/

此外，删除此行也有效:

background: url('images/alink.jpg') top center repeat-x;