Jquery Accordion 折叠面板
active Boolean/Number/jQuery/Selector/Element 第一个面板
设定默认显示的面板。设置为 false 时默认不显示面板，需 collapsible 属性设置为 true。
代码示例
创建实例时设置属性值
$(".class").accordion({active:2});
实例化后得到属性值
var active = $("#id").accordion("option","active");
实例化后设置属性值
$("#id").accordion("option","active",2);animated Boolean/String "slide"
设定面板折叠动画效果。设置为 false 禁止动画效果。内置"slide"、"easeslide"、"bounceslide"。更多效果需加载 Effects Core。
代码示例
创建实例时设置属性值
$(".class").accordion({animated:"easeslide"});
实例化后得到属性值
var animated = $("#id").accordion("option","animated");
实例化后设置属性值
$("#id").accordion("option","animated","easeslide");autoHeight Boolean true
是否设定最高面板高度为其它所有面板高度。
代码示例
创建实例时设置属性值
$(".class").accordion({autoHeight:false});
实例化后得到属性值
var autoHeight = $("#id").accordion("option","autoHeight");
实例化后设置属性值
$("#id").accordion("option","autoHeight",false);clearStyle Boolean false
设定为 true 时，折叠面板后自动清除 height 和 overflow 样式。适用于动态加载面板内容。与 autoHeight 属性不兼容。
代码示例
创建实例时设置属性值
$(".class").accordion({clearStyle:true});
实例化后得到属性值
var clearStyle = $("#id").accordion("option","clearStyle");
实例化后设置属性值
$("#id").accordion("option","clearStyle",true);collapsible Boolean false
是否允许折叠全部面板。设为 false 时必须显示一个面板。
代码示例
创建实例时设置属性值
$(".class").accordion({collapsible:true});
实例化后得到属性值
var collapsible = $("#id").accordion("option","collapsible");
实例化后设置属性值
$("#id").accordion("option","collapsible",true);event String "click"
设置切换面板的事件。
代码示例
创建实例时设置属性值
$(".class").accordion({event:"mouseover"});
实例化后得到属性值
var event = $("#id").accordion("option","event");
实例化后设置属性值
$("#id").accordion("option","event","mouseover");fillSpace Boolean false
设置为 true 时，高度自动填充满父元素。将覆盖 autoHeight 属性。
代码示例
创建实例时设置属性值
$(".class").accordion({fillSpace:true});
实例化后得到属性值
var fillSpace = $("#id").accordion("option","fillSpace");
实例化后设置属性值
$("#id").accordion("option","fillSpace",true);header Selector/jQuery "> li > :first-child,> :not(li):even"
设置面板标题元素。
代码示例
创建实例时设置属性值
$(".class").accordion({header:"> div > h3"});
实例化后得到属性值
var header = $("#id").accordion("option","header");
实例化后设置属性值
$("#id").accordion("option","header","> div > h3");icons Object { "header":"ui-icon-triangle-1-e","headerSelected":"ui-icon-triangle-1-s"}
设置面板标题图标。header：折叠时图标；headerSelected：打开时图标。
代码示例
创建实例时设置属性值
$(".class").accordion({icons:{ "header":"ui-icon-plus","headerSelected":"ui-icon-minus"}});
实例化后得到属性值
var icons = $("#id").accordion("option","icons");
实例化后设置属性值
$("#id").accordion("option","icons",{ "header":"ui-icon-plus","headerSelected":"ui-icon-minus"});navigation Boolean false
设置为 true 时，自动打开 href 属性与 location.href 相同的面板。用于使用 URL 保持面板打开状态。
代码示例
创建实例时设置属性值
$(".class").accordion({navigation:true});
实例化后得到属性值
var navigation = $("#id").accordion("option","navigation");
实例化后设置属性值
$("#id").accordion("option","navigation",true);navigationFilter Function
自定义 navigation 属性检查函数。
代码示例
创建实例时设置属性值
$(".class").accordion({navigationFilter:false});
实例化后得到属性值
var navigationFilter = $("#id").accordion("option","navigationFilter");
实例化后设置属性值
$("#id").accordion("option","navigationFilter",false);