Skip to content

praveenr-CodeCrafter/unwrap-present

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🎁 Interactive Gift Animation

This repository contains a fun and interactive animation where a clickable gift box triggers a festive surprise. The project is built with HTML, CSS, and JavaScript, and it was created as a part of a CodePen challenge.

🎯 Features

  • Interactive Gift Box: Hover over the gift to see it shake.
  • Click-to-Unwrap: Clicking the gift reveals a hidden message: Happy 2025!.
  • Festive Confetti Animation: Colorful confetti bursts when the gift is unwrapped.
  • Reset Functionality: The gift automatically resets after a few seconds for repeated fun.

🛠 How It Works

  1. Hover Animation: The gift shakes when hovered over, giving a playful effect.
  2. Click Interaction: Clicking the gift hides the box, displays the message, and starts the confetti animation.
  3. Confetti Animation: Randomly generated confetti falls across the screen with varying colors and speeds.
  4. Auto Reset: After 6 seconds, the gift resets to its original state, ready to be unwrapped again.

🚀 How to Run

  1. Clone the repository: git clone https://github.com/Praveen10/unwrap-present.git
  2. Navigate to the project directory: cd unwrap-present
  3. Open index.html in your browser to see the animation in action.

📄 License

This project is open-source and available under the MIT License. Feel free to use, modify, and share it!

About

This repository contains a fun and interactive animation

Topics

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published