Accelerated JavaScript animation.
Permalink
Failed to load latest commit information.
.github Add BrowserStack logo Feb 9, 2018
legacy Refactor as ES6 to build on RollupJS (#873) May 27, 2018
src-ui Refactor as ES6 to build on RollupJS (#873) May 27, 2018
src Remove nested calc values on complete Jul 8, 2018
test Lock down some publicly accessible structures Jun 6, 2018
.babelrc Refactor as ES6 to build on RollupJS (#873) May 27, 2018
.editorconfig Add editorconfig. See #706 for more. Oct 13, 2016
.gitignore Refactor as ES6 to build on RollupJS (#873) May 27, 2018
CHANGELOG.md Update auto-changelog (#883) Jun 28, 2018
CODE_OF_CONDUCT.md ...And apparently the CODE_OF_CONDUCT.md must be in the root... Feb 2, 2018
CONTRIBUTING.md Add templates for issues and PRs, update CONTRIBUTING.md Feb 2, 2018
LICENSE.md Update LICENSE.md Oct 10, 2014
README.md Update README.md Jun 30, 2018
V2_CHANGES.md Update the V2_CHANGES.md file Jun 3, 2018
bower.json v1.4.0 - CDN links TODO when updated Dec 4, 2016
package-lock.json Update packages and rebuild Aug 4, 2018
package.json Update packages and rebuild Aug 4, 2018
rollup.config.js Slightly cleanup Promise handling, remove comments from minified output May 29, 2018
tsconfig.json Refactor as ES6 to build on RollupJS (#873) May 27, 2018
tslint.json Refactor as ES6 to build on RollupJS (#873) May 27, 2018
velocity.d.ts add void return-type annotation Jun 29, 2018
velocity.es5.js Update packages and rebuild Aug 4, 2018
velocity.es5.js.map Update packages and rebuild Aug 4, 2018
velocity.js Update packages and rebuild Aug 4, 2018
velocity.js.map Update packages and rebuild Aug 4, 2018
velocity.min.js Update packages and rebuild Aug 4, 2018
velocity.ui.js Refactor as ES6 to build on RollupJS (#873) May 27, 2018
velocity.ui.js.map Refactor as ES6 to build on RollupJS (#873) May 27, 2018
velocity.ui.min.js Refactor as ES6 to build on RollupJS (#873) May 27, 2018
version.ts 2.0.5 Jun 10, 2018

README.md

Velocity beta

npm npm (tag) cdnjs version npm downloads jsdelivr downloads

NPM: npm install velocity-animate@beta

Docs

https://github.com/julianshapiro/velocity/wiki

IMPORTANT: The velocityjs.org documentation refers to V1, not V2 beta - use the wiki for latest documentation!

News

WhatsApp, Tumblr, Windows, Samsung, Uber, and thousands of other companies rely on Velocity. Visit Libscore.com to see which sites use Velocity on their homepage.

React Plugin

Announcement: https://fabric.io/blog/introducing-the-velocityreact-library
Repo: https://github.com/twitter-fabric/velocity-react
NPM: https://www.npmjs.com/package/velocity-react

Quickstart

Velocity (CDN, choose one of them):

<script src="//cdn.jsdelivr.net/npm/velocity-animate@2.0/velocity.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/velocity/2.0.3/velocity.min.js"></script>

Velocity UI pack (CDN, choose one of them):

<script src="//cdn.jsdelivr.net/npm/velocity-animate@2.0/velocity.ui.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/velocity/2.0.3/velocity.ui.min.js"></script>

Please note that JSDelivr can automatically supply the latest release, while CloudFlare needs to ask for a specific version.

Package managers:

npm: npm install velocity-animate@beta

Automagic chaining:

If using the .velocity(...) chained function in libraries such as jQuery or Zepto you need to ensure that Velocity is loaded after them. If you wish to add it to anything loaded afterwards then look at the Velocity.patch() method.

Questions or Problems?

Ask on StackOverflow (make sure you add the [velocity.js] and the [javascript] or [typescript] tags).

Updates

  • 2.0: Typescript update and complete refactoring.
  • 1.5: Bugfixes, IE9 compatibility fixes.
  • 1.4: Pause / Resume (per element or global).
    Forcefed string animation (just have matching number spaces) including unit conversions and colour names (ie background:["rgba(red,0.1)", "blue"]). High resolution timers (animations should be slightly smoother).
    Various fixes including ticker (loading Velocity in a background window) and color handling.
  • 1.3: Code cleanup - no breaking changes known.
  • 1.2: Custom tweens. Custom easings. "Finish" command.
  • 1.0: File name changed to velocity.js. Read VelocityJS.org/#dependencies.
  • 0.1: stop now stops animations immediately (instead of only clearing the remainder of the animation queue). No other backwards-incompatible changes were made.

Learn

Comparisons

  • CSS transitions are meant for simple interface flourishes.
  • jQuery's $.animate() is slow and poorly-equipped for motion design.
  • Velocity is a fast, feature-rich standalone alternative to jQuery's $.animate().

License

MIT License. © Julian Shapiro (http://twitter.com/julian).

Sponsors

Kiss My Button sponsors Velocity's development.

BrowserStack provides browser testing services for Velocity.