Features of ScrollReveal.Js
- It is very small about 3 KB in size.
- No dependency. No need to use any dependency js library like jQuery.
- Very easy to install
- Very simple coding syntax
Firstly you need this library file. For this, You can download from its GitHub repositories. If you don't want to take it from GitHub you can also use Bower to download.
bower install scrollReveal.js
Now you have a library. You have to add this library in your project before closing tag of the body (</body>).
It's time to make a web page animated. Actually, ScrollReveal Js searches elements having attribute "data-src'. So, you just add 'data-src' in all elements in which you want scrollReveal animation working. See the following example of code.
<div data-sr>first div to animate</div>
<div data-sr>second div to animate</div>
<div data-sr>yet another div to animate</div>
That's it. Run your page and see the magic.
Check out another example on jsfiddle: