项目：fullpage.js
地址：
https://github.com/alvarotrigo/fullPage.js结构：
<div class="outerBox">
<div class="innerBox">Vertical</div>
<div class="innerBox">Vertical</div>
<div class="innerBox">
<!--vertical-->
<div class="slideBox">Herizonal</div>
<div class="slideBox">Herizonal</div>
<div class="slideBox">Herizonal</div>
</div>
<div class="innerBox">Vertical</div>
</div>
原理：
1.外层一个固定宽高的outerBox，设置overflow：hidden；
2.1. 垂直：设置相对位置垂直排列的innerBox
2.2. 水平：原理同上。
3.js库里集成了一个jquery.mousewheel插件进行鼠标监听，库自己（这里不确定）做了键盘按键的监听。
4.检测鼠标动作（up/down），获取当前的index，并设置下一页的next/prev，使用css3属性（开启的话，因为那样比较速度比较好。。），transform:translate3d(x,y,z)，这里注意，不管你的innerBox的index是多少，其实都是转移到next/prev，再判断当前的index和targetIndex，如果没到到达，就继续执行一次slideUP/slideDown函数。
5.至于动画，不多解释。