https://github.com/its-kunal/parallaz
Basic Parallax effect using react, react-spring.
https://github.com/its-kunal/parallaz
parallax parallax-effect parallax-web react react-spring typescript
Last synced: 5 months ago
JSON representation
Basic Parallax effect using react, react-spring.
- Host: GitHub
- URL: https://github.com/its-kunal/parallaz
- Owner: its-kunal
- Created: 2023-07-01T13:00:45.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-09-19T05:28:08.000Z (over 1 year ago)
- Last Synced: 2025-07-26T02:39:43.367Z (8 months ago)
- Topics: parallax, parallax-effect, parallax-web, react, react-spring, typescript
- Language: TypeScript
- Homepage: https://its-kunal.github.io/parallaz/
- Size: 2.62 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: Readme.md
Awesome Lists containing this project
README
# Parallaz
Example of Parallax Effect using npm libraries like [React](https://react.dev/), [React-spring](https://www.react-spring.dev/).
## About Code
This code snippet is a React component written in TypeScript. It exports a default function named App that returns JSX markup. The component uses the Parallax component from a library to create a parallax scrolling effect. The JSX markup includes several ParallaxLayer components, which are nested inside the Parallax component. Each ParallaxLayer has different properties such as offset, speed, and factor to control its position and behavior within the parallax effect. The markup also includes img and div elements with various classNames and styles to display images and text.
## Attribution
- [Freepik](https://freepik.com/) (for the graphics)
- Chat GPT (for the poem)
## Demo
https://github.com/its-kunal/parallaz/assets/92196937/5eca38c5-7fa0-45b6-81cc-a1c78d1d6247