2

次のチュートリアルに従ってドロップダウンメニューを実装しようとすると、奇妙な問題に直面します。http ://www.webchief.co.uk/blog/simple-jquery-dropdown-menu/index.phponmouseoutイベントはカーソルがドロップダウン選択の2番目の要素（ユニの追加）を選択しようとするとすぐにトリガーされます。ただし、カーソルが最初のメニュー項目（アドレス帳）にある限り、すべてが完全に機能します。

<ul id="menulist">    
    <li class="menuOut"><a id="nav_User_User" title="@LocalizationMapper.NavigationProfile" href="javascript:void(0);" onclick="utils.Ajax.ajaxCall('User/User','','GET', '#main', 'false', this, null, true);">@LocalizationMapper.NavigationProfile</a>
           <ul>
              <li><a href="#">Address Book</a></li>
              <li><a href="#">Add Uni</a></li>
          </ul>
         <div class="clear"></div>
     </li>
</ul>

<script type="text/javascript">
    $(document).ready(function () {
        $('#menuList > li').live('mouseover', openSubMenu);
        $('#menuList > li').live('mouseout', closeSubMenu);
        function openSubMenu() {
            $(this).find('ul').css('visibility', 'visible');
        };

        function closeSubMenu() {
            $(this).find('ul').css('visibility', 'hidden');
        };
</script>


        /*style the sub menu*/
#menuList li ul {
    position:absolute;
    visibility:hidden;
    border-top:1px solid #fff;
    margin:0;
    padding:0;
}

#menuList li ul li {
    display:inline;
    float:none !important;
}

#menuList li ul li a:link, .menuList li ul li a:visited {
    background-color:#000;
    width:auto;
}

#menuList li ul li a:hover {
    color:#0CF; 
}

</style>
4

1 に答える 1

3

それでようやく自分で問題を解決しました。サブメニューにz-indexを追加することで成功しました。

<style>
[...]
z-index: 3;
</style>
于 2012-06-18T08:49:06.697 に答える