An animate on scroll Web Component built with StencilJS
MIT License
nice-anim is a Web Component that allows you to easily animate elements when scrolled into view by wrapping them.
<nice-anim direction="up" duration="500">
<p>Animating text!</p>
</nice-anim>
There are 3 options to install nice-anim
.
<script src='https://unpkg.com/nice-anim/dist/nice-anim.js'></script>
in the head of your index.html.npm install nice-anim --save
<script src='node_modules/nice-anim/dist/nice-anim.js'></script>
in the head of your index.html.npm install nice-anim --save
import 'nice-anim';
Some browsers don't have the Intersection Observer API. You can include the following script to add support to those browsers without it.
<script src="https://polyfill.io/v2/polyfill.min.js?features=IntersectionObserver"></script>
You can read more about Intersection Observer polyfills here.