PHP群:95885625 Hbuilder+MUI群:81989597 站长QQ:634381967
    您现在的位置: 首页 > JS特效 > 菜单导航 > 正文

    黑色大气jquery二级下拉导航特效代码

    作者:admin来源:网络浏览:时间:2014-08-27 08:56:27我要评论
    分享到

    内容介绍

    一款基于jquery代码实现的简洁二级下拉导航代码,鼠标悬停后下拉显示二级内容,同时一级栏目背景保持高亮显示。B5教程网推荐下载!站长必备js网页特效及js广告代码,提供高质量js特效下载。
    核心代码

    <script>
    function dropMenu(obj){
    $(obj).each(function(){
    var theSpan = $(this);
    var theMenu = theSpan.find(".submenu");
    var tarHeight = theMenu.height();
    theMenu.css({height:0,opacity:0});
     
    var t1;
     
    function expand() {
    clearTimeout(t1);
    theSpan.find('a').addClass("selected");
    theMenu.stop().show().animate({height:tarHeight,opacity:1},200);
    }
     
    function collapse() {
    clearTimeout(t1);
    t1 = setTimeout(function(){
    theSpan.find('a').removeClass("selected");
    theMenu.stop().animate({height:0,opacity:0},200,function(){
    $(this).css({display:"none"});
    });
    }, 250);
    }
     
    theSpan.hover(expand, collapse);
    theMenu.hover(expand, collapse);
    });
    }
     
    $(document).ready(function(){
     
    dropMenu(".drop-menu-effect");
     
    });
    </script>
    下载资源:141 下载积分:0 积分
    转载请注明(B5教程网)原文链接:https://b5.mxunkeji.com/content-50-423-1.html