jQuery如何让鼠标经过菜单时显示子菜单并且鼠标经过子菜单时子菜单也显示

来源:互联网 发布:我知女人心综艺节目 编辑:程序博客网 时间:2024/05/16 16:16

jQuery如何让鼠标经过菜单时显示子菜单并且鼠标经过子菜单时子菜单也显示

关键思路就是在父菜单栏的hover函数里再加入子菜单的hover函数

jq代码:

$(function() {
    PopoutMenu("police_computer_network");
});
function PopoutMenu(v) {
    $('#' + v).find('li').hide();


    $('#' + v).find('.m_itemMain').hover(
            function() {
                 $('#' + v).find('li').hover(function() {
                     $('#' + v).find('li').show();
                },
                        function() {
                             $('#' + v).find('li').hide()
                        }
                );
                $(this).prev().find('li').show().end().siblings().find('li').hide();
            },
            function() {
                 $('#' + v).find('li').hover(function() {
                     $('#' + v).find('li').show();
                },
                        function() {
                             $('#' + v).find('li').hide()
                        }
                );
                $(this).prev().find('li').hide().end().siblings().find('li').show()
            }
    );
}

HTML代码:

 <div id="police_computer_network" >
                <ul>          
                            <li><a href="#" target="_blank">XXXXX</a></li>                 
                </ul>
                <div class="m_itemMain m_up">全国公安网</div>
            </div>

效果如图:


1 0
原创粉丝点击