通过使用ScrollMe插件，可以将静态的页面添加动态的效果，让页面整体动感起来，ScrollMe插件使用非常的简单，只需要在元素中添加属性即可。
Github地址：https://github.com/nckprsn/scrollme
引入核心文件：
<script src='js/jquery.scrollme.js'></script>
在html结构中添加属性，示例代码如下：
<div class="scrollme">
<div
class="animateme"
data-when="enter"
data-from="0.5"
data-to="0"
data-opacity="0"
data-translatex="-200"
data-rotatez="90"
>
Yup, that's all.
</div>
</div>
Options选项参数如下：
when
决定滚动的边界开始和结束,有三个参数：
enter:从容器的顶部进入视窗时退出
exit：从容器的底部进入视窗时退出
span：从容器的顶部进入视窗到底部进行视窗
from & to
指定滚动边界内动画的起始位置与结束位置，值为： 0 - 1
easing
设置动画的形式
"easeout": 缓冲淡出.
"easein": 缓冲淡入.
"easeinout": 淡出.
"linear": 无动画.
crop
是否限制滚动边界在文档边界内。值：true 和false
opacity
元素的透明度，值：0 - 1
scale, scalex, scaley & scalez
指定元素的坐标x,y,z的数值实现滚动动画效果
rotatex, rotatey & rotatez
指定元素在X,Y和Z轴的角度旋转数值。
translatex, translatey & translatez
指定的距离把动画元素沿X、Y和Z轴数值
鄂公网安备 42090202000212号