您的位置:首页 > Web前端 > JQuery

fm.revealator.jquery.js 滚动页面,控制页面元素逐一出来

2017-03-02 00:00 651 查看
摘要: 页面滚动插件,进入视窗感应插件

【插件名称】:fm.revealator.jquery.js 单词:Revea lator 揭示器

【github地址】https://github.com/FaroeMedia/revealator

【功能介绍】Revealator-制作元素进入视口产生动画的jQuery,下来出来,上移消失。亮点是:而且进入和消失的还有N多动画效果可选。
demo页面地址:http://opensource.faroemedia.com/revealator/

支持: 多种动画样式,以及一次或者多次,什么意思?

一次:页面初始化加载一次,拉下来显示,就完毕,

多次:拉下去显示,拉上来再消失;

另一个视窗内监控滚动而元素出来
https://github.com/jlmakes/scrollreveal

【使用方法】

指定对应的class名称即可

【动画效果如下】

.revealator-fade,
.revealator-slideup,
.revealator-slideleft,
.revealator-slideright,
.revealator-slidedown,
.revealator-zoomin,
.revealator-zoomout,
.revealator-rotateleft,
.revealator-rotateright

Usage

include in head:

<link rel="stylesheet" href="fm.revealator.jquery.css">
<script src="jquery-1.11.3.min.js"></script>
<script src="fm.revealator.jquery.js"></script>

example on usage:

<div class="revealator-zoomin">
Some text or elements
</div>

<div class="revealator-fadein revealator-slideup revealator-once revealator-delay2 revealator-duration5">
Some text or elements
</div>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息