navScroll

使用 navScroll

navScroll 是一个点击导航滚动到指定容器，本插件由原生JavaScript所编写，不需要任何JS库。

更新说明

					=== V1.2.0 ===
					1.修正某个导航不需要 navScroll 功能。
					2.如本页中 导航中的 M.J 一样。链接功能依旧保持。
					
					=== V1.1.0 ===
					1.增加scroll事件，根据 scroll 在 box 的位置给 nav 添加 class，
					2.调用方法改动

1.引用JS

<script type="text/javascript" src="navScroll.js"></script>

2.增加HTML

					<ul class="navigation clearfix" id="navigation">
						<li><a href="#box-1" class="current">Box-1</a></li>
						<li><a href="#box-2">Box-2</a></li>
						<li><a href="#box-3">Box-3</a></li>
						<li><a href="http://webjyh.com">M.J</a></li>
						<li><a href="#box-4">Box-4</a></li>
						<li><a href="#box-5">Box-5</a></li>
					</ul>

PS：HTML 结构中的 a 链接中 href 的值就是你所对应要跳转到 Box 的位置，这跟锚点的做法一样。

例如：href="#box-1" 值为 #box-1 则对应的 Box就是 <div id="box-1"></div> 点击之后会跳转到 id为Box-1的位置。

3.增加JS

					new navScroll({
						nav : {                  //导航跳转功能，不需要可以删除此代码块
							id : 'navigation',   //点击跳转到容器的导航ID 请把 ID 设置给 UL 
							current : 'current', //默认点击A链接后，默认样式名
							speed : 25,          //动画执行速度，越小则越快。反之，越慢。
							fixPx :40            //在导航使用绝对定位且在窗口上方，容器与导航的差,默认为0
						}
					});

Expand：扩展功能调整布局

说明：此功能是用于当窗口宽度小于容器宽度，内容居中显示。只适合最外成容器ID。

例如：外容器 id="wrap-main" 宽度定义为 1200px 当窗口小于1200 内容会以中间显示，裁剪两边的，有点类似于 CSS 中 margin:0px auto;效果。在设置此效果时，需要将 body 设置以下CSS body { overflow-x:hidden; }

调用扩展

					new navScroll({
						resizeWrap : {           //调整布局功能，不需要此功能，此代码块可以删除
							wrap : 'wrap',       //外容器ID
							maxWidth : 600       //窗口小于多少PX调整布局，不需要此功能，参数可以删除
						},
						nav : {                  //导航跳转功能，不需要可以删除此代码块
							id : 'navigation',   //点击跳转到容器的导航ID 请把 ID 设置给 UL 
							current : 'current', //默认点击A链接后，默认样式名
							speed : 25,          //动画执行速度，越小则越快。反之，越慢。
							fixPx :40            //在导航使用绝对定位且在窗口上方，容器与导航的差,默认为0
						}
					});