Member-only story

animated scrolling template with AOS(7 scrolling animation library links)

YvonneDev
2 min readOct 6, 2020

--

AOS scrolling animated library template apply.

The animated scrolling library has lots of options. I’ll list some below:

delighter.js — -CSS3 animation effects when scrolling

scrollreveal.js — -animated elements when scroll page example page(fortnite gun gallary)

Parallax with Javascript

Laxxx.js — -a light weight Plugin to create animation when scrolling

AOS animation demo

smoove.js — Gorgeous CSS3 Scroll Effects

jquery-scrolla.js — -a jQuery plugin for reveal animations when scrolling

Download the landing template from tailwind.

There are 4 sample pages and 4 kinds of projects, such as HTML, angular, react, and vueJS.

I grab the HTML page.

My demo code is Github.

AOS library Github

In this demo, I only set the attributes to the div I want animate in the HTML tag.

such as “data-aos” and “data-aos-delay”.

Initialize AOS:

AOS.init();// You can also pass an optional settings object
// below…

--

--

YvonneDev
YvonneDev

Written by YvonneDev

❤️Front-end Web Development self-taught *share what I learned*

No responses yet