传统的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. LeetCode(7)Reverse Integer

    题目: Reverse digits of an integer. Example1: x = 123, return 321 Example2: x = -123, return -321 分析: ...

  2. ubuntu14.04安装搜狗拼音以及Google-chrome

    安装搜狗拼音 1.进入https://pinyin.sogou.com/linux/选择合适版本下载: 2.直接打开deb包进行安装: 3.安装完成后,打开系统设置中语言支持选项,在键盘输入方式系统中 ...

  3. python基础学习笔记——模块

    自定义模块 我们今天来学习一下自定义模块(也就是私人订制),我们要自定义模块,首先就要知道什么是模块啊 一个函数封装一个功能,比如现在有一个软件,不可能将所有程序都写入一个文件,所以咱们应该分文件,组 ...

  4. Appium+python自动化-appium元素定位

    前言 appium定位app上的元素,可以通过id,name.class这些属性定位到 一.id定位 1.appium的id属性也就是通过UI Automator工具查看的resource-id属性

  5. UI测试点

    UI测试点 1.界面是否美观 2.元素大小 3.界面元素是否对齐方式统一 4.界面字体属性是否正确 5.界面链接及触发动作 6.元素内容是否显示正确.易懂.友好 7.所有输入框进行输入判断测试 8.所 ...

  6. Convolution Fundamental II

    Practical Advice Using Open-Source Implementation We have learned a lot of NNs and ConvNets architec ...

  7. linux下ln命令

    转自:http://www.cnblogs.com/peida/archive/2012/12/11/2812294.html ln是linux中又一个非常重要命令,它的功能是为某一个文件在另外一个位 ...

  8. TOJ 5021: Exchange Puzzle

    5021: Exchange Puzzle  Time Limit(Common/Java):1000MS/3000MS     Memory Limit:65536KByteTotal Submit ...

  9. HDU1007 TLE代码和AC代码对比

    这题卡了一天,上午开始看算法导论,然后实现了,一开始是wa,后来TLE,由于我开始的实现方式比较笨,而且在递归调用的时候很是混乱,用了好多数组.导致我的代码不断的出问题.具体是算法导论33-4. 后来 ...

  10. 在ubuntu上安装npm

    sudo apt install npm 执行上面的安装命令,会报错: Reading package lists... Done Building dependency tree Reading s ...