- Versatile Animation Classes: Apply four different animations to any HTML element by using the classes left-to-right, right-to-left, up-to-bottom, and bottom-to-top.
- Scroll-Triggered Animations: Utilizes the IntersectionObserver API to trigger animations only when elements come into view, enhancing performance and user engagement. Seamless Integration: No need to know the specific elements in advance. Just add the appropriate class to any element, and the tool handles the rest.
- Reusable Code: The tool is built with modular CSS and JavaScript, ensuring easy integration and reuse in various projects.
Copy paste the following links into your html project
- CSS - CDN
<link href="https://cdn.jsdelivr.net/gh/dev-skipo/OpenFram@main/OpenFram_v0.1.css" rel="stylesheet" crossorigin="anonymous">
- JS - CDN
<script src="https://cdn.jsdelivr.net/gh/dev-skipo/OpenFram@main/OpenFram_v0.1.js"></script>
Add this classes to an element to perform animation on selected element :
- Animation from left to right
class="left-to-right"
- Animation from right to left
class="right-to-left"