jquery verticalnav自适应垂直多级带图标菜单效果代码-html代码-BFW代码库

jquery verticalnav自适应垂直多级带图标菜单效果代码

代码语言：html

代码描述：jquery verticalnav自适应垂直多级带图标菜单效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome.3.2.0.css">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/verticalnav.css">
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.1.11.min.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/verticalnav.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$(".vertical-nav").verticalnav({speed:400,align:"left"});
});
</script>

</head>
<body style="background:#dedede;">

<ul class="vertical-nav dark red">
	<li class="active"><a href="#"><i class="icon-home"></i>首页</a></li>
	<li>
		<a href="#"><i class="icon-cogs"></i>服务<span class="submenu-icon"></span></a>
		<ul>
			<li><a href="#">二级导航</a></li>
			<li><a href="#">二级导航</a></li>
			<li><a href="#">二级导航</a></li>
			<li><a href="#">二级导航</a></li>
			<li><a href="#">二级导航</a></li>
			<li><a href="#">二级导航</a></li>
		</ul>
	</li>
	<li>
		<a href="#"><i class="icon-briefcase"></i>产品<span class="submenu-icon"></span></a>
		<ul>
			<li><a href="#">二级导航</a></li>
			&.........完整代码请登录后点击上方下载按钮下载查看