This repository acts as a demo and showcases different scroll-triggered animations using CSS KeyFrames and Framer Motion. I hope that exploring my work will spark creativity and new ideas, thank you for your interest in my app!
You can choose between two animation types; CSS KeyFrames and Framer Motion. Simply utilize the buttons located on the 'navigation' bar to switch between the two.
CSS KeyFrames
- Animate side.
- Animate up.
Framer Motion
- Animate side.
- Animate up.
- Infinite text increases velocity when scrolling up or down; has side and up variations.
Other - Not Scroll Triggered
- Loading screen with a loading bar.
- Loading spinner on buttons
- Navigation bar pops in and out.
- Start Scrolling indicator.
- Infinite scrolling text with CSS keyframes.
- Parallax tilt hover effect on cards.
I hope these examples serve as a learning resource. If you find this helpful consider buying me a coffee, your support helps me stay motivated!
