基于bootstrap样式的tree，
<!doctype html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>bootstrap 树</title>
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">
<style>
.hj-tree{
border:1px solid #ddd;
}
.list-group {
padding-left: 0;
margin-bottom: 1px;
}
.list-group-item {
position: relative;
display: block;
padding: 0px;
padding-top:5px;
padding-bottom:5px;
padding-left:20px;
margin-bottom: -1px;
background-color: #fff;
border: 0px solid #ddd;
}
.child-list-group{
display:none;
}
.hj-tree-node{
cursor: pointer;
border:0px solid red;
}
.hj-node-gly{
padding-right:10px;
}
</style>
</head>
<body>
<div class="container-fluid">
<div class="hj-tree">
<ul class="list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>一级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>一级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>一级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-folder-open hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>二级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>四级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="list-group-item">
<p class="media hj-tree-node"><span class="glyphicon glyphicon-plus hj-node-gly"></span>三级菜单</p>
<ul class="list-group child-list-group">
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-plus hj-node-gly"></span>
<a href="">五级菜单</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</div>
<!-- jQuery文件-->
<script src="admin/js/jquery-1.8.0.min.js"></script>
<script>
$(".hj-tree-node").toggle(
function () {
$(this).children().removeClass("glyphicon-plus");
$(this).children().addClass("glyphicon-minus");
$(this).next(".child-list-group").slideDown();
},
function () {
$(this).children().addClass("glyphicon-plus");
$(this).children().removeClass("glyphicon-minus");
$(this).next(".child-list-group").slideUp();
}
);
</script>
</body>
</html>
运行效果：
基于bootstrap样式的tree，的更多相关文章
- 表格布局----基于bootstrap样式 布局
在实际开发中,我们通过菜鸟教程复制的表格往往不能满足我们的开发需求,样式很难看,而且不能自适应,尤其是需要到处Excel的样式,感觉非常糟糕,这次我就写了一个表单,不足之处,希望大神们多多指教: 代码 ...
- 基于Bootstrap样式的 jQuery UI 控件 (v0.5).
网址:http://www.shouce.ren/example/show/s/6444#download-bootstrap
- 循序渐进BootstrapVue，开发公司门户网站（1）---基于Bootstrap网站模板构建组件界面
在前面随笔<使用BootstrapVue相关组件,构建Vue项目界面>概括性的介绍了BootstrapVue的使用过程,其实选用这个主要就是希望能够用来构建一些公司门户网站的内容,毕竟基于 ...
- 基于bootstrap框架在ie8以下,兼容媒体查询[css样式]
<style type="text/css"> /*基于bootstrap框架在ie8以下,兼容媒体查询*/ .row [class^="col-" ...
- JS组件系列——基于Bootstrap Ace模板的菜单和Tab页效果分享（你值得拥有）
前言:最近园子里多了许多谈语言.谈环境.谈逼格(格局)的文章,看看笑笑过后,殊不知其实都是然并卵.提升自己的技术才是王道.之前博主分享过多篇bootstrap组件的文章,引起了很多园友的关注和支持,看 ...
- 基于Bootstrap仿淘宝分页控件实现
.header { cursor: pointer } p { margin: 3px 6px } th { background: lightblue; width: 20% } table { t ...
- 基于Bootstrap的DropDownList的JQuery组件的完善版
在前文 创建基于Bootstrap的下拉菜单的DropDownList的JQuery插件 中,实现了DropDownList的JQuery组件,但是留有遗憾.就是当下拉菜单出现滚动条的时候,滚动条会覆 ...
- （新手向）基于Bootstrap的简单轮播图的手机实现
个人电脑里存了不少适合手机欣赏的图片,但是放手机里看是件很占据资源的事.鉴于家里有一台电脑经常开着,正好用来做家庭局域网共享,于是笔者就设想通过一种比较简单环保的思路.通过手机访问电脑内的图片. 首先 ...
- 基于Bootstrap的超酷jQuery开关按钮插件
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJgAAAA2CAIAAAC0tsfoAAAB/0lEQVR4nO3bQWrCQBTGcc/mbVz0DD
随机推荐
- 笔记：解决VS2015 不能加载.edmx 的解决方案
1. 首先你要安装 VS2015镜像中的packages->EFTools文件(最后拷贝出来,因为发现直接运行其下的EFTools.msi文件安装会有问题),然后安装里面的EFTools.msi ...
- Atitit.软件兼容性原理与实践 v5 qa2.docx
Atitit.软件兼容性原理与实践 v5 qa2.docx 1. Keyword2 2. 提升兼容性的原则2 2.1. What 与how 分离2 2.2. 老人老办法,新人新办法,只新增,少修改 ...
- React Native：使用 JavaScript 构建原生应用
[转载] 本篇为联合翻译,译者:寸志,范洪春,kmokidd,姜天意 数月前,Facebook 对外宣布了正在开发的 React Native 框架,这个框架允许你使用 JavaScript 开发原生 ...
- 使用PullToRefresh插件实现ListView下拉刷新（Android Studio）
下载PullToRefresh
- java日历显示年份、月份
import java.util.Scanner;class CalendarMain{ //主函数入口 public static void main(String[] args) ...
- 【转】浅谈JavaScript、ES5、ES6
什么是JavaScript JavaScript一种动态类型.弱类型.基于原型的客户端脚本语言,用来给HTML网页增加动态功能.(好吧,概念什么最讨厌了) 动态: 在运行时确定数据类型.变量使用之前不 ...
- ORA-00600 3020 ORA-10567案例
PlateSpin克隆复制出的Oracle数据库服务器,往往启动数据库实例都会遇到一些杂七杂八的问题.今天测试DR环境时又遇到了一个特殊场景,在此之前,我已经遇到了下面两起案例: ORA-00600: ...
- oracel数据导出导入
一.导出模式(三种模式)及命令格式 1. 全库模式 exp 用户名/密码@网络服务名 full=y file=路径\文件名.dmp log=路径\文件名.log 2. 用户模式(一般情况下采用此模式) ...
- js中判断对象具体类型
大家可能知道js中判断对象类型可以用typeof来判断.看下面的情况 <script> alert(typeof 1);//number alert(typeof "2" ...
- MonoBehaviour Lifecycle(生命周期/脚本执行顺序)
脚本执行顺序 前言 搭建一个示例来验证Unity脚本的执行顺序,大概测试以下部分: 物理方面(Physics) 渲染(Scene rendering) 输入事件(InputEvent) 流程图 Uni ...