传统的layzload只能适用于图片懒加载，而我们现在需要的是全部元素的懒加载！

官网：https://scrollrevealjs.org/

gitHub：https://github.com/jlmakes/scrollreveal

提供了两种使用方式：

1.使用script标签（提供国内加载）

 <script src="https://cdn.bootcss.com/scrollReveal.js/4.0.0-beta.26/scrollreveal.min.js"></script>

2.下载zip包

https://github.com/jlmakes/scrollreveal.git

我们怎样使用呢？（Github已经提供了方式）

针对某个类做出的懒加载动作！（不过你要考虑到ajax异步请求加载图片）

Github示例：

https://github.com/Sunnshino/scroll-example.git

scrollReveal 使用的更多相关文章

  1. ScrollReveal.js – 帮助你实现超炫的元素运动效果

    ScrollReveal.js 用于创建和管理元素进入可视区域时的动画效果,帮助你的网站增加吸引力.只需要给元素增加 data-scrollreveal 属性,当元素进入可视区域的时候会自动被触发设置 ...

  2. 强大的scrollReveal库，炫酷的页面缓入效果。

    首先我问来看一下这个强大的插件能做出什么效果,下面是我找的一个网站: http://kepler.gl/#/, 接下来看看官网给出的效果:https://scrollrevealjs.org/. 是不 ...

  3. scrollReveal.js – 页面滚动显示动画JS

    简介 和 WOW.js 一样,scrollReveal.js 也是一款页面滚动显示动画的  JavaScript ,能让页面更加有趣,更吸引用户眼球.不同的是  WOW.js  的动画只播放一次,而 ...

  4. ScrollReveal.js 用于创建和管理元素进入可视区域时的动画效果，帮助你的网站增加吸引力。

    ScrollReveal.js 用于创建和管理元素进入可视区域时的动画效果,帮助你的网站增加吸引力. 1.http://www.yangqq.com/jstt/css3/2017-08-08/787. ...

  5. scrollReveal.js页面滚动动态效果

    scrollReveal.jshttp://www.dowebok.com/134.html简介 和 WOW.js 一样,scrollReveal.js 也是一款页面滚动显示动画的 JavaScrip ...

  6. [UI] Elastic Stack & scrollReveal.js

    Elastic Stack & scrollReveal.js Elastic Stack http://freebiesbug.com/code-stuff/elastistack-js-d ...

  7. scrollreveal(页面滚动显示动画插件支持手机)

    scrollreveal.js是一款可以轻易实现桌面和移动浏览器元素随页面滚动产生动画的js插件.该插件通过配置可以在页面滚动,元素进入视口时产生炫酷的动画效果,同时还支持元素的3D效果,非常的实用. ...

  8. scrollReveal（页面缓入效果插件）

    scrollReveal(页面缓入效果插件)实现页面滚动时动画加载元素效果 前面我去了解了元素距页面视图距离,想实现页面滚动是动画加载元素(https://www.cnblogs.com/chengh ...

  9. scrollReveal.js导致页面加载完之后页面中点击事件添加的css参数失效了（我的Hexo next博客引发的问题）

    文章目录 时间 背景 问题解决 个人博客:https://mmmmmm.me 源码:https://github.com/dataiyangu/dataiyangu.github.io 时间 2019 ...

随机推荐

  1. python基础学习笔记——包

    包的简介 你们听到的包,可不是女同胞疯狂喜欢的那个包,我们来看看这个是啥包 官方解释: 1 2 3 4 5 6 7 8 9 Packages are a way of structuring Pyth ...

  2. mysql 面安装配置

    解压MySQL压缩包    将以下载的MySQL压缩包解压到自定义目录下,我的解压目录是:    "D:\Program Files\MySQL\mysql-5.6.13-win32&quo ...

  3. Leetcode 406.根据身高重建队列

    根据身高重建队列 假设有打乱顺序的一群人站成一个队列. 每个人由一个整数对(h, k)表示,其中h是这个人的身高,k是排在这个人前面且身高大于或等于h的人数. 编写一个算法来重建这个队列. 注意:总人 ...

  4. 九度oj 题目1140：八皇后

    题目描述: 会下国际象棋的人都很清楚:皇后可以在横.竖.斜线上不限步数地吃掉其他棋子.如何将8个皇后放在棋盘上(有8 * 8个方格),使它们谁也不能被吃掉!这就是著名的八皇后问题. 对于某个满足要求的 ...

  5. springmvc简单的xml文件配置步骤

    1.配置web.xml的servlet标签,在此标签中配置服务器配置文件 2.配置web.xml的servlet-mapping标签 3.配置application.xml的自动扫描包的位置 4.配置 ...

  6. Failed building wheel for Twisted

    在安装scrapy框架的过程中,pip install scrapy 出现报错信息: building 'twisted.test.raiser' extension error: Microsoft ...

  7. Linux（15）：shell 编程

    shell基础 什么是 shell ? Shell是一个命令解释器,它的作用是解释执行用户输入的命令及程序等,用户输入一条命令, Shell 就解释执行一条. 这种从键盘一输入命令,就可以立即得到回应 ...

  8. Linux（14）：集群架构进阶 --- CentOS 7

    CentOS 7 CentOS 7 管理软件常用命令: vim /etc/selinux/config # 修改 SELINUX 开机自启动与否 setenforce 0 # 关闭 SELINUX g ...

  9. 二分图最小覆盖的Konig定理及其证明,最小的覆盖证明

    [转http://www.cppblog.com/abilitytao/archive/2009/09/02/95147.html  ->  http://yejingx.ycool.com/p ...

  10. Nastya Studies Informatics

    Nastya Studies Informatics   time limit per test 1 second   memory limit per test 256 megabytes   in ...