罗和正单双中特

jQuery多级收缩菜单

所属分类:导航-垂直导航,手风琴菜单

 13678  119  查看评论 (0)
分享到微?#25490;?#21451;圈
X
jQuery多级收缩菜单 ie兼容8

更新时间:2019/4/15 上午10:50:41

更新说明:

1.页面JS进行修改,取消原本直接定义的菜单,直接改用json文件用ajax请求.

2.菜单用递归的方法写的,可?#26434;?#26080;限级,但是超过五级得自己加CSS

.nav_box .level["第几级"] em {
    padding-left: 50px;
}

使用方法

引用jquery和LeftNav.css,LeftNav.js

<link rel="stylesheet" type="text/css" href="css/LeftNav.css"/>
<script src="http://www.bkufgw.tw/jquery/jquery-1.10.2.js"></script>
<script src="js/LeftNav.js" type="text/javascript" charset="utf-8"></script>

html导航容器

<div class="left"></div>

js导航数据

var menu = {
    name: '', //名字
    level: '0',
    haschildren: true, //是否有子节点
    url: '#', //url路径
    isopen: false, //是否展开
    children: [{ //子节点
        name: '1',
        level: '1',
        haschildren: true,
        url: '',
        isopen: true,
        children: [{
            name: '1.1',
            level: '2',
            haschildren: true,
            url: '',
            isopen: true,
            children: [{
                name: '1.1.1',
                level: '3',
                haschildren: false,
                url: './14-1.html',
                isopen: true,
                children: ''
            }, {
                name: '1.1.2',
                level: '3',
                haschildren: false,
                url: '#',
                isopen: false,
                children: ''
            }]
        }]
    }]
}

调用插件

$.leftNav(".left",menu);
相关插件-垂直导航,手风琴菜单

jQuery旅游网站导航

简单的旅游网站导航,加入了ie6对png的支持
  垂直导航
 17788  165

基于jQuery的垂直菜单特效

网站上常用的到的垂直菜单,基于jQuery的垂直菜单特效
  垂直导航
 27955  182

jquery下拉菜单导航

jquery hover事件下拉菜单导航仿京东商城商品分类导航样式布局,通过鼠标滑过商品分类导航展示商品分类子菜单内容的效果
  垂直导航
 31943  184

超酷的SVG左侧导航栏特效

超酷的SVG左侧导航栏特效(Cool SVG left navigation bar effects)
  垂直导航
 30092  322

讨论这个项目(0)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

取消回复
罗和正单双中特
pk10五码两期计划人工 河北福彩十一选五胆拖投注表 红马计划安卓免费版 pk10专家在线预测 时时彩后二组选稳赚 香l港中特一码 幸运飞艇挂机稳赢模式 彩票快3好的投注方法 香港5分彩有计划吗 极速赛车双面盘计划软件