Animate Elements On Scroll Using Animate.css

Category: Animation , Javascript | September 15, 2017
Author: wallacesilva
Views Total: 1,821 views
Official Page: Go to website
Last Update: September 15, 2017
License: MIT

Preview:

Animate Elements On Scroll Using Animate.css

Description:

Just another JavaScript plugin that makes use of animate.css based CSS animations to animate any DOM elements as they enter the window.

How to use it:

Include the necessary animate.css in the header of the html page.

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">

Include the minified version of the animate on scroll library at the bottom of the web page.

<script src="animate-on-scroll.min.js"></script>

Add an animation of your choice to the target element using ‘data-animation’ attribute as this:

<img class="aos-item" 
     data-animation="fadeInLeft" 
     src="1.jpg"
>

You Might Be Interested In:


Leave a Reply