Skip to content
GFoniX edited this page Jan 7, 2023 · 7 revisions
- NOTE: This documentation is for Velocity v2.

Velocity.js

Accelerated JavaScript Animation


Overview

Velocity is an animation engine with a similar API to jQuery's $.animate(). It has no dependencies, but will happily extend jQuery, Zepto, and even the native DOM. It's incredibly fast, and it features color animation, transforms, loops, easings, SVG support, and scrolling.

Download

Download Velocity, include it on your page, then read the documentation for how to use it. If moving over from jQuery animations, then it will work for most situations by simply changing .animate to .velocity.

Compatibility

Velocity v2 is designed for modern browsers, and has dropped a lot of the compatibility code which slows down animations. In the future there will be an extra file to be used on older browsers from IE8+, however it currently supports IE11, Edge, Chrome, Safari, and Firefox. Most other browsers are based on those same browser engines. There is an extensive test suite, and Velocity uses standard Javascript code which should work in all modern browsers.

UI-Pack

The UI-Pack with Velocity supplies a large number of animations designed to show, hide, or bring attention. These animations are taken from the excellent animate.css project.

If using the animations please do remember to import the correct file if not including it via a script tag:

import "velocity-animate/velocity.ui.min.js";