
今天做了一个左侧菜单的效果,做后台的时候应该会经常用到这个效果的,代码同样是简洁明了,复制即可用:
效果图如下:
代码如下:(这个上下箭头的图标如上,图标可自己换)
代码如下:
后台左侧菜单点击上下滑动显示jquery script>
$(function(){
$(".box dt:first").addClass("active");
$(".box dd:not(:first)").hide();
$(".box dt").click(function(){
$(this).next("dd").slideToggle()
.siblings("dd").slideUp();
$(this).toggleClass('active')
.siblings("dt").removeClass("active");
});
});
script>
标题一
第一项
第二项
第三项
标题二
第一项
第二项
第三项
标题三
第一项
第二项
第三项
标题四
第一项
第二项
第三项