Aos animation

Aos js

CSS
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">

JS
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>

INITIALIZE AOS:
<script>
  AOS.init();
</script>

Aos animation

<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script>
AOS.init({
	duration: 1200,
});
</script>

Aos animate install

//install
npm install aos --save


//initialize in react

import AOS from 'aos'
import 'aos/dist/aos.css';
AOS.init();

Aos animation

// In your terminal
yarn add aos@next or npm install --save aos@next

// In your JS file
import AOS from 'aos';
import 'aos/dist/aos.css';

AOS.init();

// then, you can add data-aos attributes in your html

Aos css

/*Add styles in <head>: */

  <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />

/*Add script right before closing </body> tag, and initialize AOS:*/
  <script src="https://unpkg.com/aos@next/dist/aos.js"></script>
  <script>
    AOS.init();
  </script>

Aos animation

<div data-aos="zoom-in-right"></div>

Source: michalsnik.github.io

Similar codes

5 votes142 views2 answers
Materialize css cdn
CSS
4 votes154 views2 answers
Can we use material ui and tailwind css together
CSS
0 vote147 views1 answer
Apt list only security updates
CSS
103 votes145 views2 answers
What are the types of positioning in css
CSS
1 vote237 views1 answer
How to take in space and enter as it is in a textarea
CSS
1 vote139 views1 answer
Why is my css code not working
CSS
5 votes153 views2 answers
How to select child when hover on parent element css
CSS
18 votes209 views2 answers
Rgba blue colo
CSS
99 votes154 views2 answers
Css absolute in absolute
CSS
2 votes132 views1 answer
Css percent minus pixel
CSS