>  Q&A  >  본문

二级导航制作实现不是很理解?

这一段js不是很明白,为什么要判断长度是否大于零啊,stop(true,true)为什么用这个呢,不是很理解

  <div class="nav_child_bg hidden"></div>
        <div class="nav_list_all">
            <div class="nav_list">
                <a class="on" href="index.html">首页</a>
            </div>
            <div class="nav_list">
                <a href="profile.html">公司简介</a>
            </div>
            <div class="nav_list">
                <a href="speech.html">董事长致辞</a>
            </div>
            <div class="nav_list">
                <a href="architecture.html">组织架构</a>
            </div>
            <div class="nav_list">
                <a href="certificate.html">资质证书</a>
            </div>
            <div class="nav_list">
                <a href="dynamic.html">项目动态</a>
            </div>
            <div class="nav_list">
                <a class=""  href="project.html">精品工程</a>
                <div class="nav_child hidden">
                    <a href="project_inf01.html">烟囱工程</a>
                    <a href="project_inf02.html">筒仓工程</a>
                    <a href="project_inf03.html">冷却塔工程</a>
                    <a href="project_inf04.html">烟囱缸内简工程</a>
                    <a href="project_inf05.html">工业土建工程</a>
                    <a href="project_inf06.html">其他工程</a>
                </div>
            </div>
            <div class="nav_list nav_list_static">
                <a class="" href="performance.html">工程业绩</a>
                <div class="nav_child nav_child_yeji hidden">
                    <a href="performance.html">烟囱工程</a>
                    <a href="performance02.html">筒仓工程</a>
                    <a href="performance03.html">冷却塔工程</a>
                    <a href="performance04.html">烟囱缸内简工程</a>
                    <a href="performance05.html">工业土建工程</a>
                    <a href="performance06.html">其他工程</a>
                </div>
            </div>
            <div class="nav_list">
                <a href="contact.html">联系我们</a>
            </div>
        </div>
    </nav>// 导航移上去显示二级导航的效果 
$(".nav_list_all").find(".nav_list").hover(function(){
    if($(this).find(".nav_child").length>0){
        $(".nav_child_bg").stop(true,true).slideDown(200);
        $(this).find(".nav_child").stop(true,true).slideDown(300);
    }
},function(){
    $(".nav_child_bg").stop(true,true).slideUp(300);
    $(this).find(".nav_child").stop(true,true).slideUp(200);
})
phpcn_u251phpcn_u2512809일 전1011

모든 응답(2)나는 대답할 것이다

  • 数据分析师

    数据分析师2017-10-01 00:40:48

    2차 내비게이션 제작 및 구현이 이해가 안 되시나요? -PHP 중국사이트 Q&A - 2차 내비게이션 제작 구현이 이해가 안 되시나요? -PHP 중국어 홈페이지 Q&A

    꼭 보고 배워보세요.

    회신하다
    0
  • 阿神

    阿神2017-03-04 15:04:22

    1.不判断长度是否大于零。长度为零时(".nav_child").stop执行会报错,因为无可执行对象,同时也可以节省操作,长度为零则不需要展开。$(".nav_child_bg")(应该是背景吧),背景是不需要移动的。
    2.stop(true,true)。hover会在移入和移出的时候触发分别触发一个回调函数。你想一下,触发移出的时候,移入动画还未执行完毕(仍然在展开),是不是就不是你预期的移出的效果(收回),会有一定滞后(已经需要收回了,动画还在执行展开)。而且把stop()都去掉频繁hover会导致无操作时动画还在跑。

    회신하다
    0
  • 취소회신하다