scrollReveal(页面缓入效果插件)
2024-10-06 14:32:19
scrollReveal(页面缓入效果插件)实现页面滚动时动画加载元素效果
前面我去了解了元素距页面视图距离,想实现页面滚动是动画加载元素(https://www.cnblogs.com/chenghuayike/p/11970731.html)到处撞墙,心肥意冷啊┭┮﹏┭┮,猛然间发现了scrollReveal 插件,查看了官档后明白过来,这不就是我想实现的效果嘛,还是太过于萌新了。。。
好了,接下来我总结了一下 scrollReveal 插件的基本使用方法,加强记忆!!
scrollReveal 插件使用起来非常的简单,三部曲:
1.引入 scrollReveal :
<script src="https://unpkg.com/scrollreveal" type="text/javascript" charset="utf-8"></script>
// 或者下载到本地使用
2.js代码:
window.sr = ScrollReveal();
sr.reveal('.foo'); // 这里的 .foo 为元素类名 引用与jquery语法相同
3.html代码:
<div id="containers">
<div class="foo"> Foo最新文章
- SharePoint 2013: A feature with ID has already been installed in this farm
- java线程 公平锁 ReentrantLock(boolean fair)
- 廖雪峰js教程笔记12 用DOM更新 innerHMTL 和修改css样式
- js 增删改查方法
- CSS3设置多张背景图片
- CSS中的浮动问题
- 在mac os下的Apache服务器的cgi中运行python
- android ListView 中getview学习总结
- 修改 SVN 账户密码的方法
- ViewTreeObserver类概述
- oracle 大表删除数据后,回收空间的问题。
- mysql主从复制 详解
- 基于visual Studio2013解决面试题之1408桶排序
- 深入理解java String 及intern
- An abandoned sentiment from past
- 使用VMware Workstation安装win7镜像文件时遇见的错误
- 安全框架Shiro入门
- Python——正则表达式特殊符号及用法
- CV code references
- ORA-12541:TNS:无监听程序
热门文章