jQuery通用的二级下拉菜单滑动效果

jQuery通用的二级下拉菜单滑动效果

这是一个从商城扒出来的导航下拉效果,代码很简洁,主要由jQuery的animate+opacity来完成。

淘建站为您提供更多_导航菜单_下拉导航_动画_菜单,在此特别感谢您对我们的支持与厚爱!

查看演示

演示不了,点击反馈

加入收藏

下载 487 次

打赏作者

觉得不错,可打赏下作者

下载资源

免费共享

特别说明:本站资源来自网友发布分享,仅供学习与参考,请勿用于商业用途,若有侵权请联系删除(272966172@qq.com)。

function dropMenu(obj) {
    $(obj).each(function() {
        var theSpan = $(this);
        var theMenu = theSpan.find(".submenu");
        var tarHeight = theMenu.height();
        theMenu.css({height: 0, opacity: 0});
        theSpan.hover(
                function() {
                    $(this).addClass("selected");
                    theMenu.stop().show().animate({height: tarHeight, opacity: 1}, 400);
                },
                function() {
                    $(this).removeClass("selected");
                    theMenu.stop().animate({height: 0, opacity: 0}, 400, function() {
                        $(this).css({display: "none"});
                    });
                }
        );
    });
}

$(document).ready(function() {

    dropMenu(".drop-menu-effect");

});

声明:本资料由淘建站会员提供,如转载注明来源,资料来源淘建站免费素材库:https://www.taojz.cn/texiao/762.html
jQuery通用的二级下拉菜单滑动效果 希望对你有帮助,感谢您的支持!
  • javascript+fullPage演示9种全屏滚动

    javascript+fullPage演示9种全屏滚动

  • jQuery动画导航菜单效果

    jQuery动画导航菜单效果

  • jQuery背景可滑动的导航菜单

    jQuery背景可滑动的导航菜单

  • jQuery导航菜单上下翻动效果

    jQuery导航菜单上下翻动效果

  • jQuery仿京东首页左侧菜单导航

    jQuery仿京东首页左侧菜单导航

  • jQuery手机下拉多级菜单

    jQuery手机下拉多级菜单

  • jQuery高亮二级缓冲折叠菜单

    jQuery高亮二级缓冲折叠菜单

  • jQuery企业酷炫下拉导航

    jQuery企业酷炫下拉导航

  • jQuery制作火焰动画菜单效果

    jQuery制作火焰动画菜单效果

  • jQuery手机环形圆角菜单效果

    jQuery手机环形圆角菜单效果

  • jQuery简单博客下拉导航菜单效果

    jQuery简单博客下拉导航菜单效果

  • jQuery无限级导航菜单效果

    jQuery无限级导航菜单效果

  • 留言(0)
    头像
     阿里云限量代金券,戳我领取
    1 2