1、引用折叠菜单
$('#accordion').accordion();
2、修改accordion样式
//无需修改ui里的css,直接用style.css代替
.ui-widget-header{
background:#333;
}
3、accordion属性
类似于选项卡tabs,简单描述几个
(1)heightStyle:'auto',表示以最高的长度作为首选(表示自适应)
(2)header:设置标题所用的标签(header:'h3')
(3)icons:设置想要的图标
4、accordion事件
(1)create:表示创建的时候触发,在ui中有两个子属性header,panel
(2)activate:表示切换的时候触发
newHeader、oldHeader、newPanel、oldPanel
(3)beforeActivate:表示切换之前触发该事件
(同上)
(4)accordion('option',param):获取某个属性的值
(5)accordion('option',param,value):设置某个属性的值
5、accordion中使用on()
提供使用on()方法处理的事件方法
(1)accordionactivate:折叠菜单切换时触发
(2)accordionbeforeactivate:折叠菜单切换前触发
//菜单切换时触发
$('#accordion').on('accordionactivate',function(){
alert('菜单切换时触发!');
});