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. Django基础(10): URL重定向的HttpResponseDirect, redirect和reverse的用法详解

    利用django开发web应用, 我们经常需要进行URL重定向,有时候还需要给URL传递额外的参数.比如用户添加文章完成后需要转到文章列表或某篇文章详情.因此熟练掌握HttpResponseDirec ...

  2. php 使用fileupload上传多张图片，压缩包

    test.php <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  3. JS使用onscroll、scrollTop实现图片懒加载

    今天做到项目中的图片展示,由于每一页的图片数量都很多,因此需要为图片的展示设计一种懒加载的功能. 第一要做的当然就是给程序添加滚动监听事件. //触发拉取图片开关,保证正在拉取时不能再次触发 var ...

  4. Spring Boot(十五)：spring boot+jpa+thymeleaf增删改查示例

    Spring Boot(十五):spring boot+jpa+thymeleaf增删改查示例 一.快速上手 1,配置文件 (1)pom包配置 pom包里面添加jpa和thymeleaf的相关包引用 ...

  5. WEB后台认证机制

    mark to :http://www.cnblogs.com/xiekeli/p/5607107.html HTTP Basic Auth HTTP Basic Auth简单点说明就是每次请求API ...

  6. android样式之按钮&&图片

    在drawable-hdpi中添加xml文件 <?xml version="1.0" encoding="utf-8"?> <selector ...

  7. linux下安装与部署redis

    一.Redis介绍 Redis是当前比较热门的NOSQL系统之一,它是一个key-value存储系统.和Memcache类似,但很大程度补偿了Memcache的不足,它支持存储的value类型相对更多 ...

  8. 20145315何佳蕾《网络对抗》web基础

    实验步骤 (1).Web前端HTML(1分) 能正常安装.启停Apache.理解HTML,理解表单,理解GET与POST方法,编写一个含有表单的HTML. (2).Web前端javascipt(1分) ...

  9. JavaScript中冒泡与事件委托

    冒泡 事件触发后事件流的三个阶段按顺序依次是: 1.捕获阶段 2.目标阶段 3.冒泡阶段 大盒子包裹小盒子,两个盒子都分别添加点击事件,当点击小盒子,两个盒子的事件都会触发. 事件委托 下级元素委托上 ...

  10. C语言三个结束符：EOF ‘\0’ '\n'