react-global-animate-on-scroll v1.0.4

Globally animated elements on scroll with React!

https://github.com/lucasKoyama/react-global-animate-on-scroll/assets/121680414/c2cf2721-9835-4f2c-b1a7-9d51a543824d

react-global-animate-on-scroll is animations based on scroll in react made very simple!

Installation

npm i react-global-animate-on-scroll

Usage

Import

import AnimateOnScroll from 'react-global-animate-on-scroll';

Insert the component as the last component of App so it will have access to the entire DOM and its elements, just like the image below, the <AnimateOnScroll /> is one line above the closing fragment </>

Add the class "animate__animated" for all animations and another animation that you liked from animate.css

<h1 class="animate__animated animate__fadeInUp">An animated element</h1>

The component have a boolean prop called "animateOnce" to decide if the animations is gonna happen just for the first time or everytime. Default is set to "animateOnce=false"

<AnimateOnScroll animateOnce/>