0

「ホバーオフ」機能に問題があります。ほとんどの場合、完全な機能が動作します。にカーソルを合わせて、必要に応じ<li>て基になるものを表示でき<ul>ます。問題は、ユーザーがマウスを離して<li>子<ul>とリンクを選択したときに発生します。ご覧のとおり、「ホバーアウト」機能が作動し、子<ul>が親の中にあるという事実を否定します<li>

問題の例: li にカーソルを合わせてサブメニューを選択しようとすると

複数の CSS ポジショニングとスタイルを試して、ここにたどり着きました:

nav {
   width:100%;
   height:50px;
   background:url(../assets/navBG.jpg) 0 0 repeat;
   position:relative;
   z-index:999;
}

ul.nav {
   list-style:none;
   position:absolute;
}

ul.nav li {
   float:left;
   font-family: 'PlayRegular';
   font-size:18px;
   color:#fff;
   padding:13px 43px;
   background:url(../assets/navIcon.png) center right no-repeat;
   cursor:pointer;
}

ul.nav li > ul {
   position:absolute;
   display:none;
   list-style:none;
   width:100%;
   height:auto;
   top:50px;
   left:0;
   overflow:hidden;
   background:#000;
 }

私はJqueryを使って子ulをslideDownしましたが、「ホバー可能」にする方法を見つけることができません

$("ul.nav li").hover( function() {
    $(this).find("ul").slideDown({
        duration: 300,
        easing: "linear",
        queue: false        
    });
}, function() {
    $(this).find("ul").slideUp({
        duration: 300,
        easing: "linear",
        queue: false    
    });
});

<ul>子が親の一部と見なされるようにするために何か不足してい<li>ますか? JqueryまたはCSSの問題ですか？私はそれが HTML の問題ではないことを知っています。<divs>

4

1 に答える 1

0

スクリプトはここで正常に動作します。DEMO http://jsfiddle.net/yeyene/4RxGf/1/

このデモでは、jquery lib は v1.9.1 です。このバージョンでサイトをテストしますか?

$("ul.nav li").hover( function() {
    $(this).stop().find("ul").slideDown({
        duration: 300,
        easing: "linear",
        queue: false        
    });
}, function() {
    $(this).stop().find("ul").slideUp({
        duration: 300,
        easing: "linear",
        queue: false    
    });
});
于 2013-07-09T02:43:20.653 に答える