首页 > 代码库 > 简洁的jQuery cxMenu 手风琴导航
简洁的jQuery cxMenu 手风琴导航
- 版本：
- jQuery v1.7+
- jQuery cxMenu v1.2
- 注意事项：
- 自动判断是否有子导航，有则显示并不触发链接，无则触发链接。
实例预览
使用方法
载入 JavaScript 文件
<script src="http://www.mamicode.com/jquery.js"></script> <script src="http://www.mamicode.com/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 | 同时只展开一个导航 |
下载
简洁的jQuery cxMenu 手风琴导航
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。