- 版本：
- jQuery v1.7+
- jQuery cxMenu v1.2
- 注意事项：
- 自动判断是否有子导航，有则显示并不触发链接，无则触发链接。
使用方法
载入 JavaScript 文件
<script src="jquery.js"></script>
<script src="jquery.cxmenu.js"></script>
CSS 样式结构
除必要属性设置外，其他样式均可自行设置。
/* 滑动导航 */
.menu{}
.menu > li{}
.menu > li.selected{} /* 一级导航选中时的样式 */
.menu ul{display:none;} /* 子导航隐藏 */
.menu ul > li{}
.menu ul > li.selected{} /* 子级导航选中时的样式 */
DOM 结构
<ul id="element_id">
<li>一级标题
<ul>
<li>二级标题
<ul>
<li>...
<ul>
<li>N级标题</li>
调用 cxMenu
$('#element_id').cxMenu();
参数说明
| 名称 | 默认值 | 说明 |
|---|---|---|
| events | 'click' | 触发按钮事件的方式 |
| selectedClass | 'selected' | 展开时增加的 Class |
| speed | 600 | 切换速度 (ms) |
| only | true | 同时只展开一个导航 |