我正在使用ul li
菜单,我试图在用户结束时为所有li
个父母着色。
HTML
<ul id="jMenu">
<li class="arrow"></li>
<li><a >Category 7.2</a></li>
<li><a>Category 7.2</a></li>
<li><a>Category 7.2</a></li>
<li><a>Category 7.2</a></li>
</ul>
的CSS:
#jMenu li a {
padding:10px 25px 10px 20px;
display:block;
background-color: transparent;
color:#6d6e72;
text-transform:uppercase;
cursor:pointer;
font-size:12px;
direction:rtl;
color:#8A8B8E;
}
#jMenu li a:hover {
background-image:url('../images/header/top_menu_over2.jpg');
color:White;
background-repeat:repeat-x;
}
我制作了这个简单的jQuery脚本:
$("#jMenu").find("li").hover(function(){
$(this).parents("li").css("background-image","url('images/header/top_menu_over2.jpg');");
}, function(){
$("#jMenu").find("li").parents("li").css("background-color","#f2f2f2")
$("#jMenu").children("li").css("background-color","transparent")
$("#jMenu").find("li").parents("li").css("background-image","none");
});
它适用于IE,但不适用于Firefox或Chrome。有谁知道这是为什么?
感谢。