jquery Animation plugin Velocity.js release: Faster animation switching speed

On May 3, Julian posted a velocity.js on his github. Velocity.js is an animated jquery plugin that re-implements the jquery $.animate () method to speed up animation switching. Velocity.js is only 7k in size, it contains not only all the functions of $.animate (), but also includes color switch, transform (transform), loop, ease, CSS switch, scroll function, it is jquery, jquery UI, The best combination of CSS transformations in terms of animation. Velocity.js supports ie8+, Chrome, Firefox and other browsers, and supports Andriod and iOS. Velocity.js uses the jquery $.queue () method in its internal implementation, so it is smoother than the $.animate (), $.fade (), $.delay () Methods of jquery, and its performance is higher than the animation properties of CSS. The specific principles of the reader can refer to this article.

The velocity.js contains two input parameters, the first parameter specifies the resulting animation effect, and the second parameter is an optional parameter that specifies additional options for the animation. Specific as follows:

1 2 3 4 5 6 7 8 9 10 11 12 13 14

$("div").velocity({     property1: value1,     property2: value2 }, {     /* Default options */     duration: 400,     easing: "swing",     queue: "",     complete: null,     loop: false,     delay: false,     display: false,     mobileHA: true });

Velocity.js also supports jquery's parameter shorthand syntax: $element. Velocity (PropertyMap [, duration] [, easing] [, complete]):, for example:

1 2 3

$("div").velocity({ left: 100 }, 1000); $("div").velocity({ left: 100 }, 1000, "swing"); $("div").velocity({ left: 100 }, "swing");

Velocity.js official propaganda Velocity's goal is to be the leader in animation switching in the DOM. Readers can download the latest version of Velocity.js from here, because Velocity.js's method signature is the same as $.animate (), so just change the method name from animate to velocity. In its official website gave a few brilliant demo, readers can refer to learning.

Reference documents

1. http://julian.com/research/velocity/
2. http://davidwalsh.name/ Css-js-animation
3. https://news.ycombinator.com/item?id=7663775