有的页面在向下滚动的时候,有些元素会产生细小的动画效果。虽然动画比较小,但却能吸引你的注意。比如刚刚发布的 iPhone 6 的页面(查看)。如果你希望你的页面也更加有趣,那么你可以试试 WOW.js。

WOW.js 依赖 animate.css,所以它支持 animate.css 多达 60 多种的动画效果,能满足您的各种需求。

html中使用方法:

<div class="row wow fadeInUp" data-wow-duration="1s" data-wow-delay="1s">

js中使用方法:

<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/wow.min.js"></script>
<script>
$(function(){
new WOW().init();
})
</script>

animate.css配合wow.min.js实现各种页面滚动效果的更多相关文章

  1. 麦子学院bootstrap实战项目官网,后台,jquery.singlePageNav.min.js ,wow.min.js,animate.css使用

    1.源码笔记 我的源码+笔记(很重要):链接: https://pan.baidu.com/s/1eSxgLV0 密码: 2pi2 感谢麦子学院项目相关视频:链接: https://pan.baidu ...

  2. wow.js wow.min.js animate.css animate.min.css

    奉献给下载不到源码的小伙伴,下载到的请忽视 wow.js (function() { var MutationObserver, Util, WeakMap, getComputedStyle, ge ...

  3. pageresponse.min.js自动缩放页面改写

    /* * 名称 :移动端响应式框架 * 作者 :白树 http://peunzhang.cnblogs.com * 版本 :v2.1 * 日期 :2015.10.13 * 兼容 :ios 5+.and ...

  4. js实现文字上下滚动效果

    大家都知道,做html页面时,为了提升网页的用户体验,我们需要在网页中加入一些特效,比如单行区域文字上下滚动就是经常用到的特效.如下图示效果: <html> <head> &l ...

  5. js文字展示各种滚动效果

    js文字展示各种滚动效果:http://www.dowebok.com/demo/188/

  6. animate.css与wow.js制作网站动效

    animate.css 官网:https://daneden.github.io/animate.css/ 包括:attention seekers:关注者 bouncing entrances:跳跃 ...

  7. vue项目中引入animate.css和wow.js

    本文转自:https://blog.csdn.net/liyunkun888/article/details/85003152 https://www.zhuimengzhu.com/content/ ...

  8. jquery.imgpreload.min.js插件实现页面图片预加载

    页面分享地址: http://wenku.baidu.com/link?url=_-G8miwbgDmEj6miyFtjit1duJggBCJmFjR2jky_G1VftD9eS9kwGOlFWAOR ...

  9. HTML+CSS页面滚动效果处理

    HTML+CSS代码如下: <!doctype html> <html> <head> <meta charset="utf-8"> ...

随机推荐

  1. 【Selenium2+Python】常用操作

    Webdriver中比较常用的操作元素的方法: clear()    清除输入框的默认内容 send_keys("xxx")    在一个输入框里输入xx内容 ——如果输入中文,则 ...

  2. PCL安装使用

    一. 下载安装 http://pointclouds.org/downloads/windows.html 1. QT安装在默认路径下(否则后续会出现问题),添加环境变量QTDIR(c:\Qt\4.8 ...

  3. net_device 结构体分析

    /* * The DEVICE structure. * Actually, this whole structure is a big mistake. It mixes I/O * data wi ...

  4. Java 设计一个贷款计算器 简易

    import javax.swing.*; import java.awt.*; import java.awt.event.*; import javax.swing.border.*; publi ...

  5. 转:Task任务调度实现生产者消费者模式

    我们经常会遇到生产者消费者模式,比如前端各种UI操作事件触发后台逻辑等.在这种典型的应用场景中,我们可能会有4个业务处理逻辑(下文以P代表生产者,C代表消费者): 1. FIFO(先进先出)      ...

  6. Bundle

    [[NSBundle mainBundle] pathForResource:@"someFileName" ofType:@"yourFileExtension&quo ...

  7. 二叉排序树(BST)的建立

    给一个非递归的吧. /* 已知,二叉树存储结构定义见bstree.h,请编写一个算法函数bstree creatBstree(int a[],int n), 以数组a中的数据作为输入建立一棵二叉排序树 ...

  8. HTML5实战与剖析之触摸事件(touchstart、touchmove和touchend)

    HTML5中新添加了很多事件,但是由于他们的兼容问题不是很理想,应用实战性不是太强,所以在这里基本省略,咱们只分享应用广泛兼容不错的事件,日后随着兼容情况提升以后再陆续添加分享.今天为大家介绍的事件主 ...

  9. pull方法解析xml

    private void getData() {        new Thread() { public void run() {                try {              ...

  10. [hdu 2686]Matrix

    网上说这道题的题解是费用流 我粗粗看了一下数据范围,觉得出题者似乎是让我们用 “大(d)屁(p)” 的样子,为了尊重出题人,我还是写一写吧喵~ 首先,一条回路可以看做是两条路齐头并进,这是 大屁 和 ...