标签:
js:
$(function() {
	/*****************菜单手风琴效果 start******************/
	var Accordion = function(el, multiple) {
		this.el = el || {};
		this.multiple = multiple || false;
		// Variables privadas
		var menus = this.el.find(‘.menu‘);
		// Evento
		menus.on(‘click‘, {el: this.el, multiple: this.multiple}, this.dropdown)
	}
	Accordion.prototype.dropdown = function(e) {
		var $el = e.data.el;
			$this = $(this),
			$next = $this.next();
		$next.slideToggle();
		$this.parent().toggleClass(‘open‘);
		if (!e.data.multiple) {
			$el.find(‘.submenu‘).not($next).slideUp().parent().removeClass(‘open‘);
		};
	}	
	var accordion = new Accordion($(‘.accordion‘), false);
	/*****************菜单手风琴效果 end******************/
	
});
html:
<!-- aside menu start --> <div id="aside-menu"> <ul id="accordion" class="accordion"> <li> <div class="menu"><i class="glyphicon glyphicon-tasks"></i> <span>入库管理</span><i class="glyphicon glyphicon-chevron-right pull-right"></i></div> <ul class="submenu"> <li><a href="#">采购订单</a></li> <li><a href="#">收货</a></li> <li><a href="#">入库计划</a></li> <li><a href="#">组托上架</a></li> <li><a href="#">采购退货</a></li> <li><a href="#">展示信息</a></li> <li><a href="#">采购发票</a></li> </ul> </li> <li> <div class="menu"><i class="glyphicon glyphicon-user"></i> <span>出库管理</span><i class="glyphicon glyphicon-chevron-right pull-right"></i></div> <ul class="submenu"> <li><a href="#">订单</a></li> <li><a href="#">出库计划</a></li> <li><a href="#">出库顺序</a></li> <li><a href="#">销售退货</a></li> <li><a href="#">销售发票</a></li> </ul> </li> <li> <div class="menu"><i class="glyphicon glyphicon-user"></i> <span>库存管理</span><i class="glyphicon glyphicon-chevron-right pull-right"></i></div> <ul class="submenu"> <li><a href="#">货位图</a></li> <li><a href="#">盘点计划</a></li> <li><a href="#">盘点作业</a></li> <li><a href="#">库存调整</a></li> </ul> </li> </ul> </div> <!-- aside menu end -->
标签:
原文地址:http://www.cnblogs.com/guxingzhe/p/5300919.html