jquery 二级菜单

html

<div class="tab">
        <ul class="tab2">
            <li><i></i>网站首页</li>

            <li>法国留学
                <ul class="tab3">
                    <li>马赛大学</li>
                    <li>巴黎中央理工学院</li>
                    <li>斯特拉斯堡大学</li>
                    <li>卡尚高等师范学校</li>
                </ul>
            </li>

            <li>教学理念
                <ul class="tab3">
                    <li>成功</li>
                    <li>正直</li>
                    <li>善良</li>
                    <li>诚实</li>
                </ul>
            </li>

            <li>法语教学
                <ul class="tab3">
                    <li>英语教学</li>
                    <li>中文教学</li>
                    <li>日语教学</li>
                    <li>韩文教学</li>
                </ul>
            </li>

            <li>海外游学
                <ul class="tab3">
                    <li>新加坡</li>
                    <li>俄罗斯</li>
                    <li>澳大利亚</li>
                    <li>英格兰</li>
                </ul>
            </li>

            <li>法国文化
                <ul class="tab3">
                    <li>埃菲尔铁塔</li>
                    <li>浪漫之都</li>
                </ul>
            </li>

            <li>联系我们
                <ul class="tab3">
                    <li>address:xxxxx</li>
                    <li>number:xxxxx</li>
                </ul>
            </li>
        </ul>
    </div>

  </div>

 

jquery

$(".tab li").hover(function(){
    $(this).find("ul").css("display","block");
},function(){
    $(this).find("ul").css("display","none");
})

 

转载于:https://www.cnblogs.com/Agrass/p/6595871.html