0

私はメニューを使用しており、ユーザーが親の上にいるときに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 では動作しません。これがなぜなのか誰か知っていますか？

ありがとう。

4

0 に答える 0