Create Animate On Scroll Easily with Library

2016 is a year of subtle animations. With the wide support of CSS3 transform and animation properties by modern browsers, we can achieve subtle animations pretty easily.

You can either writing it yourself, or simply use the off-the-shelves solutions (which is quite many nowadays) Here we have another good once called - Animate On Scroll librayr (AOS).

To add AOS to your website is very simple - you just need to add data-aos to the element and define an animation class for it. Once user scroll to that certain page position, it will trigger the animation.

Of course, you can also define when to start the animation sooner or later by using data-aos-offset, data-aos-duration for animation duration, data-aos-delay, delay the animation and etc.

You can also trigger the animation of actual element based on other element by using data-aos-anchor.

I'd say, it's pretty flexible and it has a pretty clear documentation to help you get started.

It comes with 20 easing functions and over 26 animations.

SPECIFICATIONS & DOWNLOAD

• TAGS:
• Animation
• CSS
• CSS Transform
• CSS3