欢迎光临一流素材网,免积分免费素材下载!
AD
当前位置:首页 > JS代码 > 菜单导航

Jquery简洁实现的手机网站侧栏菜单JS代码

所属栏目:菜单导航更新时间:2016-12-24原作者:不详发布者:deepdfhy浏览:0
基本信息
  • 发布者:
  • 原作者:不详
  • 来源:不详
  • 版权声明


如今手机网站越来越多了,而手机网站中JS侧栏菜单非常实用,基本上绝大部分手机网站都会用到。

一流资源网之前分享过几款JS手机侧栏菜单代码,今天再分享一款代码非常简洁易用,效果也特棒的JS侧栏菜单代码。


动图演示:

手机测滑菜单.gif

代码非常简洁

<!DOCTYPE HTML>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=yes" />
		<title>Jquery简洁实现的手机网站侧栏侧滑菜单JS代码_菜单导航_JS代码_一流资源网 </title>
		<meta name="keywords" content="手机网站,移动网站,侧栏菜单,侧滑菜单" />
		<meta name="description" content="如今手机网站越来越多了,而手机网站中JS侧滑侧栏菜单非常实用,基本上绝大部分手机网站都会用到。一流资源网之前分享过几款JS手机侧栏菜单代码,今天再分享一款代码非常简洁易用具体效果请看演示,一流资源网推荐下载。" />
		
		<script src="js/jquery-1.9.1.min.js"></script>
		<script src="js/jquery.mmenu.min.js"></script>
		<script type="text/javascript">
			$(function() {
				$('nav#menu').mmenu();
			});
		</script>
		<link href="css/style.css" rel="stylesheet" type="text/css">
		<link href="css/mmenu.css" rel="stylesheet" type="text/css">
		<link href="css/font-face.css" rel="stylesheet" type="text/css">
	</head>
	
	<body>
		<div id="page">
			<!--头部 start-->
			<header>
				<div class="l_tbn"><a href="#menu" class="glyphicon glyphicon-th-large"></a></div>
				标题
			</header>
			<!--头部 end-->
			
			<!--正文 start-->
			<div class="content">一流资源网整理发布,原作者WELKOM</div>
			<!--正文 end-->
			
			<!--侧边菜单 start-->
			<nav id="menu">
				<ul>
					<li class="Selected"><a href="#">按钮1</a></li>
					<li><a href="#">按钮2</a></li>
					<li><a href="#">按钮3</a></li>
					<li><a href="#">按钮4</a></li>
					<li><a href="#">按钮5</a></li>
				</ul>
			</nav>
			<!--侧边菜单 end-->
		</div>	
	</body>
</html>


具体效果请看演示,一流资源网推荐下载。

标签:
代码下载
本站下载
收藏 0 有帮助 0 没帮助 0
请站长喝杯咖啡?

站长一直坚持白天工作、晚上熬夜更新素材,付出了巨大的精力和时间,其中的辛酸难以言述。

如果本站素材对你有用,不妨考虑请站长喝杯咖啡鼓励一下!

立即打赏 0
给个评价吧
最受欢迎的

1jQuery仿微信公众号底部导航菜单自定义菜单代码

2JSON无限折叠树形菜单特效代码

3原生js树形下拉菜单插件/可定义伸缩菜单列表/支持写入cookie

4仿京东手机版左右风格TAB滑动商品分类代码

5jQuery导航滚动到一定高底后吸顶,锚点定位自动跟随

6纯HTML5二级折叠菜单代码

7jQuery垂直多级下拉树形菜单代码

8纯CSS下拉菜单导航代码JQ升级版(兼容IE6)

9纯CSS分类菜单弹出式三级菜单代码

10jquery多级/无限级树形菜单代码

最新更新的

1jQuery仿手机微信公众号底部菜单代码

2Layui多级垂直导航菜单代码

3移动端侧栏侧滑菜单JS代码

4 js移动端右侧多级导航菜单代码

5JS移动端折叠展示式导航菜单代码

6Layui响应式导航菜单

7纯CSS下拉菜单导航代码JQ升级版(兼容IE6)

8jQuery垂直多级下拉树形菜单代码

9tab导航缓慢弹出下拉效果

10纯css3制作3D旋转导航