13.9K ·GitHub
What is this?
AutoAnimate is a zero-config, drop-in animation utility that adds smooth transitions to your web app with a single line of code.
AutoAnimate is a zero-config, drop-in animation utility that adds smooth transitions to your web app with a single line of code.Is this a big animation framework, or a small library I drop into an existing app?It is a small drop-in library, not a framework: you add it to an existing app, and it ships with no dependencies of its own.
It is a small drop-in library, not a framework: you add it to an existing app, and it ships with no dependencies of its own.How do I add it to my project?Install it with your package manager of choice, then enable it with a single line of code in your app; the documentation site walks through the exact usage.
Install it with your package manager of choice, then enable it with a single line of code in your app; the documentation site walks through the exact usage.Do I have to be using a particular framework for it to work?No. It works with Vue, React, and Solid, and with any other JavaScript application, so framework-less projects are fine too.
No. It works with Vue, React, and Solid, and with any other JavaScript application, so framework-less projects are fine too.Does this live in my browser code, or do I run something on a server?It lives entirely in your front-end code: it animates the web app's interface in the browser, so there is nothing to install or run server-side.
It lives entirely in your front-end code: it animates the web app's interface in the browser, so there is nothing to install or run server-side.What does 'zero-config' mean in practice?You don't configure anything: install the package, add one line of code, and your interfaces get smooth transitions out of the box.
You don't configure anything: install the package, add one line of code, and your interfaces get smooth transitions out of the box.Where do I find usage examples and plugin instructions?The README itself stays minimal and points to the documentation site, which covers usage instructions, examples, and plugin setup.
The README itself stays minimal and points to the documentation site, which covers usage instructions, examples, and plugin setup.Is AutoAnimate free, and how is it supported?It is a free and open source project; the team asks users who find it saves them time to support it with a recurring or one-time donation.
It is a free and open source project; the team asks users who find it saves them time to support it with a recurring or one-time donation.What are similar projects?motion, shaders, velocity, canvas-ui, loadersz-core, classnames, kugiri, better-scroll
motion, shaders, velocity, canvas-ui, loadersz-core, classnames, kugiri, better-scrollWhich topics is it in?transition, solidjs, zero-dependency, dom, vue, beginner-friendly, animation, ui, web-development, react, npm, frontend
transition, solidjs, zero-dependency, dom, vue, beginner-friendly, animation, ui, web-development, react, npm, frontend