diff --git a/css/okadmin.css b/css/okadmin.css index 8e6763e..2d2e5df 100644 --- a/css/okadmin.css +++ b/css/okadmin.css @@ -3,6 +3,15 @@ @import "../lib/fonts/myfont.css"; @import "../lib/nprogress/nprogress.css"; +#navBar .layui-nav-child{ + /*transition: height .5s;*/ + overflow: hidden; + padding: 5px 0!important; +} +#navBar .layui-nav-itemed .layui-nav-child, +#navBar .layui-nav-child dd{ + overflow: hidden; +} [class^="ok-icon"], [class*=" ok-icon"] { line-height: inherit; diff --git a/js/okadmin.js b/js/okadmin.js index 5077095..9af9b2a 100644 --- a/js/okadmin.js +++ b/js/okadmin.js @@ -25,7 +25,9 @@ layui.use(['element', 'layer', 'okUtils', 'okTab'], function () { if ($(this).siblings().length == 0) { okTab.tabAdd($(this)); } - $(this).parent("li").siblings().removeClass("layui-nav-itemed");//关闭其他的二级标签 + //关闭其他的二级标签 + $(this).parent("li").siblings().removeClass("layui-nav-itemed") + }); /** @@ -93,6 +95,31 @@ layui.use(['element', 'layer', 'okUtils', 'okTab'], function () { } }); + /**动画**/ + $("#navBar").on('click', '.layui-nav-item a', function () { + if (!$(this).attr('lay-id')) { + var superEle = $(this).parent(); + var ele = $(this).next('.layui-nav-child'); + var height = ele.height(); + if (superEle.is('.layui-nav-itemed')) { + ele.height(0); + ele.animate({ + height: height + 'px' + }, function () { + ele.removeAttr('style'); + }); + } else { + ele.css({'display':'block'}); + ele.animate({ + height: 0 + }, function () { + ele.removeAttr('style'); + ele.height('auto'); + }); + } + } + }); + /** * 全屏和退出全屏的方法 * @param num