10月-29-2016 09-20-08.gif
实例地址：http://kagomejuice.com.cn/health.html
可以实现上图的滚动效果，附赠插件GITHUB：https://github.com/alvarotrigo/fullPage.js/
详细的使用方法是：
1 首先引用CSS、JS、和JQUERY:
<link rel="styleshee" type="text/css" href="css/jquery.fullPage.css">
<script src="js/jquery-2.2.0.min.js"></script>
<script src="js/jquery.fullPage.min.js"></script>
2 HTML文档内容：
<div id="fullpage">
<div id="p1" class="section active"></div>
<div id="p2" class="section"></div>
<div id="p3" class="section"></div>
</div>
fullpage是整个页面的元件，p1~p3是滚动的每一页，用class="section"定义，active是默认选中的页。
3 在文档加载完后调用fullpage功能
$(document).ready(function(){
$('#fullpage').fullpage({
afterLoad: scrollLoad,
onLeave: scrollLeave,
navigation: true
});
});
其中afterLoad是某一页加载后的回调函数，onLeave是某一页移出时的回调函数，navigation: true是使用导航点。更多的参数和功能见GITHUB。
那么，问题来了。
这个页面需要适配手机版，我在分辨率改变到手机版尺寸的时候调用取消滚动，分辨率改变到桌面版尺寸的时候调用页面滚动的功能。正常来说是调用$.fn.fullpage.xxxx来使用，但是在MAC SAFARI上页面加载完过后，偶尔会出现$.fn.fullpage是空值（不是必现），就会出现分辨率改变的时候不能滚动和页面出错的问题。
测试了好久，都没发现$.fn.fullpage到底为何会消失，但是页面加载完调用fullpage的初始化都没出现过问题，就是页面分辨率改变的时候出问题。好吧死马当活马医，在初始化的时候把$.fn.fullpage这东西用一个变量把他存起来，需要使用的时候再把值设回去……居然把问题解决了。
虽然问题是好了，但是没搞明白原因心里真不爽啊。
