1. velocity.js 插件介绍

Velocity 是独立于jQuery的，但两者可以结合使用的动画插件。用法类似 jq 的 animate ，但是支持更高级动画。

（

颜色动画、转换动画(transforms)、循环、 缓动、SVG 动画、和 滚动动画

）

2. 例子代码

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <title>Document</title>

</head>

<body>

  <h1>666</h1>

  <script src="http://velocityjs.org/js/libs/jquery-1.11.1.js"></script>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/velocity/1.5.0/velocity.min.js"></script>

  <script>

    $('h1')

    .velocity({

      fontSize:100,

      backgroundColor: "#f06d06",

      backgroundColorAlpha: 0.8,

      color:'#fefefe'

    },1500)

    .velocity('reverse',500);

  </script>

</body>

</html>

3. 相关链接

Velocity.js

velocity.js学习

一个十分好用的动画工具：Velocity.js

velocity.js 动画插件的更多相关文章

  1. js 动画效果实现

    1. 实现方式 - 应用场景 自己写 - 简单的.不用 jq 的项目 jq - 普通动画 成熟插件 - 复杂动画 2. 相关文章 JavaScript基于时间的动画算法 九种原生js动画效果 Twee ...

  2. JQuery动画插件Velocity.js发布：更快的动画切换速度

    5月3日,Julian在其GitHub上发布了Velocity.js.Velocity.js是一款动画切换的jQuery插件,它重新实现了jQuery的$.animate()方法从而加快动画切换的速度 ...

  3. jQuery动画切换引擎插件Velocity.js

    Velocity.js 官网 Velocity.js实现弹出式相框 慕课网 极棒的jquery动画切换引擎插件Velocity.js jQ库 (function($){ // 普通调用 /*$('#d ...

  4. 分享JQuery动画插件Velocity.js的六种列表加载特效

    分享JQuery动画插件Velocity.js的六种列表加载特效.在这款实例中给中六种不同的列表加载效果.分别为从上飞入.从右侧飞入.从左侧飞入.和渐显.一起看下效果图: 在线预览   源码下载 实现 ...

  5. jquery动画切换引擎插件 Velocity.js 学习01

    一.Velocity.js介绍 Velocity是一个jQuery插件,重新实现了$.animate() 来产生更高的性能(速度也比CSS动画库更快),而包括新的功能,以提高动画工作流程. Veloc ...

  6. jquery动画切换引擎插件 Velocity.js 学习02

    案例实践: 第一页会以动画形式进入页面: 点击进入按钮时,第一页以动画消失,第二页以动画形式进入,同时四张图片也定义从小到大的动画形式: 第二页关闭按钮点击时,先是四张图片以缩小动画消失,然后第二页以 ...

  7. Velocity.js发布：更快的动画切换速度

    Velocity.js是一款动画切换的jQuery插件,它重新实现了jQuery的$.animate()方法从而加快动画切换的速度.Velocity.js只有7k的大小,它不仅包含了$.animate ...

  8. 一个十分好用的动画工具：Velocity.js

    就像许多开发者确信的那样,在Web上使用CSS实现动画并不是唯一的方式,我们也可以使用JS来实现,并且JS还有一些CSS无法替代的优势. 然而抛开JS而选择CSS来实现动画,将以样式表内容膨胀,丧失对 ...

  9. 【js】插件—动效Velocity.js

    Velocity.js——加速JavaScript动画 一款替代jQuery的$ .animate()动效的插件.兼容IE8和Android2.3及以上. 相比较优点: 1.它比JQuery更快,并实 ...

随机推荐

  1. DBeaver连接Oracle11g数据库

    DBeaver连接Oracle11g数据库 一.准备 (1)dbeaver管理软件 (2)远程连接数据库地址.用户名秘密等 (3)Oracle驱动:ojdbc6.jar工具包 下载地址:https:/ ...

  2. 简单的windows窗口创建实例

    #include<windows.h> #include<tchar.h> LRESULT CALLBACK WndProc(HWND hwnd,UINT umsg,WPARA ...

  3. Eclipse自动生成方法注释 快捷键

    自动生成方法的注释格式,例如 /*** @param str* @return* @throws ParseException*/ 快捷键是 ALT + SHIFT + J,将光标放在方法名上,按快捷 ...

  4. Oracle使用——oracle表锁住，杀掉锁表进程

    背景 在操作Oracle时,多人同时操作oracle数据库的同一张表的时候,经常会造成锁表现象,这时需要手动进行解锁. 步骤 以dba身份登录Oracle数据库(否则用户缺少杀掉进程权限,需要给用户分 ...

  5. 小白学习 Redis 数据库日记(2017-06-13)

    redis 127.0.0.1:6379> LPUSH runoobkey redis(integer) 1redis 127.0.0.1:6379> LPUSH runoobkey mo ...

  6. vue学习【第五篇】：Vue组件

    什么是组件 - 每一个组件都是一个vue实例 - 每个组件均具有自身的模板template,根组件的模板就是挂载点 - 每个组件模板只能拥有一个根标签 - 子组件的数据具有作用域,以达到组件的复用 根 ...

  7. SOAP和WebService的那些事

    当初对这段历史有过一点研究,不过当初写得关于这部分历史的论文不知道被我丢哪儿去了,下面我用通俗一点的语言来话说一下这段历史吧,因为当初详细到具体人物具体时间的已经记不清了,所以这里写得不够专业,大家就 ...

  8. Linux网络参数和ifconfig

    目录 1.ifconfig 网络参数 2.ifup和ifdown 3.CentOS7网络配置相关文件 4.CentOS7默认网卡接口配置文件 5.补充命令 6.总结: 参考: 1.ifconfig 网 ...

  9. IDEA旗舰版新建web项目

    即在一个Project下(MyEclipse中为工作空间)新建一个Module. 点击,在弹出框上打一个勾,如下图: 点Next,输入项目名,如下图: 点Finish, 右键WEB-INF,新建2个D ...

  10. hihoCoder week11 树中的最长路

    题目链接: https://hihocoder.com/contest/hiho11/problem/1 求树中节点对 距离最远的长度 #include <bits/stdc++.h> u ...