Loading...

一个非常还用的网页加载动画插件

热度:

内容

简介

插件名字叫scrollReveal.js。不同于WOW.js,scrollReveal.js是独立的,无需依赖animate.css。并且插件非常小,压缩后的版本只有5.6kb。使用方法也非常简单。

引入:用script像通常一样引入即可。需要注意的是,如果你使用的jquery,记得卸载jquery之后。

使用:在div上,或者你想要有动画效果的标签上加上data-scroll-reveal。

示范:<div data-scroll-reveal="enter left and move 50px over 1.33s">dowebok.com</div>


data-scroll-reveal属性

enter

说明: 动画起始方向

值: top | right | bottom | left

move

说明: 动画执行距离

值: 数字,以 px 为单位

over

说明: 动画持续时间

值: 数字,以秒为单位

after/wait

说明: 动画延迟时间

值: 数字,以秒为单位

填充(可选)

可以在 data-scroll-reveal 属性里填充(添加)一些类似编程的“语句”,使其更有可读性,scrollReveal.js 支持以下“语句”:

from

the

and

then

but

with


发布时间
2021-12-04 17:17:22
更新时间
2021-12-04 17:17:22
简介
插件名字叫scrollReveal.js。不同于WOW.js,scrollReveal.js是独立的,无需依赖animate.css。并且插件非常小,压缩后的版本只有5.6kb。使用方法也非常简单。引入:用script像通常一样引入即可。需要注意的是,如果你使用的jquery,记得卸载jquery之后。使用:在div上,或者你想要有动画效果的标签上加上data-scroll-reveal。

网址

立即前往

相关推荐

为您推荐相关网址

Hello,欢迎来咨询~

遇到问题?请给我们留言

标签guestbookform报错:该栏目下没有新增表单属性。