1.demo

<!DOCTYPE html>

<html lang="zh-CN">

<head>

  <meta charset="utf-8">

  <title>demo</title>

  <link rel="stylesheet" href="http://cdn.dowebok.com/98/css/animate.min.css">

  <style>

    *{

      margin: 0;

      padding: 0;

    }

    .wrap{

      margin: 50px auto;

      width: 300px;

      height: 200px;

      border:1px solid red;

    }

  </style>

</head>

<body>

  <div class="wrap wow bounceInLeft">hello</div>

  <div class="wrap wow bounceInLeft">hello</div>

  <div class="wrap wow bounceInLeft">hello</div>

  <div class="wrap wow bounceInLeft">hello</div>

  <div class="wrap wow bounceInLeft">hello</div>

  <div class="wrap wow bounceInLeft">hello</div>

  <div class="wrap wow bounceInLeft">hello</div>

  <script src="http://cdn.dowebok.com/131/js/wow.min.js"></script>

  <script>

    if (!(/msie [6|7|8|9]/i.test(navigator.userAgent))) {

      new WOW().init();

    };

  </script>

</body>

</html>

2. 相关链接

WOW.js – 让页面滚动更有趣

wow

github

wow 滚动动画的更多相关文章

  1. wow.js+animate.css——有趣的页面滚动动画

    今天偶然间发现了一个使用特别简单的页面动画效果,还挺不错的,玩了一个上午,现在介绍一下这个滚动动画: 一.使用方法: 1.下载animate.css 2.下载wow.js 3.引用文件,像这样: &l ...

  2. 推荐几款制作网页滚动动画的 JavaScript 库

    这里集合了几款很棒的制作网页滚动动画的 JavaScript 库和插件.它们中,有的可以帮助你在页面滚动的时候添加动感的元素动画,有的则是实现目前非常流行的全屏页面切换动画.相信借助这些插件,你也可以 ...

  3. 循序渐进BootstrapVue，开发公司门户网站（2）--- 使用wow.js动画组件以及自定义的CSS样式处理动态效果

    在我们开发的页面中,让页面有一些动画效果,可以让页面更加有吸引力,只要不是处理太过,一般人还是希望有一些动态效果,如滚动动画加载,悬停处理变化等效果,本篇随笔介绍使用wow.js动画组件以及自定义的C ...

  4. ScrollMe – 在网页中加入各种滚动动画效果

    ScrollMe 是一款 jQuery 插件,用于给网页添加简单的滚动效果.当你向下滚动页面的时候,ScrollMe 可以缩放,旋转和平移页面上的元素.它易于设置,不需要任何自定义的 JavaScri ...

  5. 利用CSS实现带相同间隔地无缝滚动动画

    说明:因为在移动上主要利用CSS来做动画,所以没有考虑其他浏览器的兼容性,只有-webkit这个前缀,如果需要其他浏览器,请自行补齐. 首先解释一下什么是无缝滚动动画, 例如下面的例子 See the ...

  6. 微信小程序滚动动画，点击事件及评分星星制作！

    前言 小程序上线刷爆了朋友圈,但是最近渐渐消沉了,很少有动静!最近公司项目需要,体验了一下微信小程序,制作了几个功能,布局感觉很简单,但是交互和动画等写起来确实很费劲,主要是因为他不能操作DOM,只能 ...

  7. JS 实现无缝滚动动画原理（初学者入）

    这段时间在教培训班的学生使用原生javascript实现无缝滚动的动画案例,做了这个原理演示的动画,分享给自学JS的朋友!博主希望对你们有帮助! 在讲解之前先看一下demo: demo:https:/ ...

  8. Scrollanim – CSS3 & JavaScript 创建滚动动画

    Scrollanim 是结合 CSS3 和 JavaScript 来创建令人惊叹的滚动动画的开源库. Scrolanim 支持在页面上的所有可用的元素的位置.有很多的自定义参数可以配置使用,构建出精彩 ...

  9. 超详细Vue实现导航栏绑定内容锚点+滚动动画+vue-router(hash模式可用)

    超详细Vue实现导航栏绑定内容锚点+滚动动画+vue-router(hash模式可用) 转载自:https://www.jianshu.com/p/2ad8c8b5bf75 亲测有效~ <tem ...

随机推荐

  1. DOS下读取PCI配置空间信息的汇编程序（通过IOCF8/IOCFC）

    汇编程序编写的读取PCI配置空间信息的代码(通过IOCF8/IOCFC): ;------------------------------------------------ ;功能: 读取PCI 配 ...

  2. await

    单个的task await task 多个await asyncio.wait(tasks)

  3. Windows下用cmd命令实例讲解yii2.0 的控制台定时任务

    Yii中的资源是和Web页面相关的文件,可为CSS文件,JavaScript文件,图片或视频等,资源放在Web可访问的目录下,直接被Web服务器调用. 有时候有些功能需要做到计划任务中去,因此就需要y ...

  4. Centos7.3+uwsgi+Nginx部署Django程序

    1. 安装Python,这里我用的是阿里云的centos7.3,自带python2,所以,此步略过,具体安装Python可Google. 2. 安装uwsgi,如果安装失败的话首先,我的Python解 ...

  5. spring boot mvc系列-静态资源配置与MappingHandler拦截器

    静态资源配置 Spring Boot 默认将 /** 所有访问映射到以下目录: classpath:/static classpath:/public classpath:/resources cla ...

  6. gdb调试程序函数名为问号，什么原因？step by step解决方案

    gdb调试程序函数名为问号,什么原因? http://bbs.chinaunix.net/thread-1823649-1-1.html http://www.bubuko.com/infodetai ...

  7. 八数码问题 Eight Digital Problem

    八数码问题 利用启发式搜索,找出以下问题的最优解. #include <iostream> #include <vector> #include <algorithm&g ...

  8. 2018年北京信息科技大学第十届程序设计竞赛暨ACM选拔赛题解

    链接:https://www.nowcoder.com/acm/contest/118/A 来源:牛客网 PUBG 时间限制:C/C++ 1秒,其他语言2秒 空间限制:C/C++ 32768K,其他语 ...

  9. bzoj 2434 阿狸的打字机 - Aho-Corasick自动机 - 树状数组

    题目传送门 传送站I 传送站II 题目大意 阿狸有一个打字机,它有3种键: 向缓冲区追加小写字母 P:打印当前缓冲区(缓冲区不变) B:删除缓冲区中最后一个字符 然后多次询问第$x$个被打印出来的串在 ...

  10. Codeforces 822C Hacker, pack your bags! - 贪心

    It's well known that the best way to distract from something is to do one's favourite thing. Job is ...