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

最新文章

  1. SharePoint 2013: A feature with ID has already been installed in this farm
  2. java线程 公平锁 ReentrantLock(boolean fair)
  3. 廖雪峰js教程笔记12 用DOM更新 innerHMTL 和修改css样式
  4. js 增删改查方法
  5. CSS3设置多张背景图片
  6. CSS中的浮动问题
  7. 在mac os下的Apache服务器的cgi中运行python
  8. android ListView 中getview学习总结
  9. 修改 SVN 账户密码的方法
  10. ViewTreeObserver类概述
  11. oracle 大表删除数据后,回收空间的问题。
  12. mysql主从复制 详解
  13. 基于visual Studio2013解决面试题之1408桶排序
  14. 深入理解java String 及intern
  15. An abandoned sentiment from past
  16. 使用VMware Workstation安装win7镜像文件时遇见的错误
  17. 安全框架Shiro入门
  18. Python——正则表达式特殊符号及用法
  19. CV code references
  20. ORA-12541:TNS:无监听程序

热门文章

  1. [转帖]MMU内存管理单元
  2. Maven打包成可执行JAR(带依赖包)
  3. 一个好隐蔽的C/C++代码bug
  4. OOP_面向对象程序设计概述
  5. Idea生成的的第一个eureka注册中心服务器
  6. SAS学习笔记38 SAS Comments注释语句
  7. ajax回调函数,全局变量赋值后,ajax外无法获取的解决
  8. javascript 数组去重的方法
  9. 区间dp最长回文子序列问题
  10. Java内存 模型理解