https://github.com/harman8815/kakashi-website

Animated Website of a fictional character KAKASHI HATAKE
https://github.com/harman8815/kakashi-website

animated-website web-project

Last synced: 6 months ago
JSON representation

Animated Website of a fictional character KAKASHI HATAKE

• Host: GitHub
• URL: https://github.com/harman8815/kakashi-website
• Owner: Harman8815
• Created: 2024-03-23T14:45:01.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2024-03-28T10:47:02.000Z (over 2 years ago)
• Last Synced: 2025-04-04T16:39:54.819Z (about 1 year ago)
• Topics: animated-website, web-project
• Language: HTML
• Homepage: https://kakashi-animated-v2.netlify.app/
• Size: 5.37 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# 🌀 [Animated Kakashi Website](https://kakashi-animated-v2.netlify.app/)

## 📝 Description

This GitHub repository contains the source code for an animated Kakashi website implemented using HTML, CSS, and JavaScript. The website features a dynamic and interactive design, with animations powered by GSAP (GreenSock Animation Platform). The site includes a tilt effect that responds to mouse movements on laptops and gyroscope movements on Android devices. 🚀

## Kakashi Website Preview

![ScreenShot_20240328155527](https://github.com/Harman8815/Kakashi-Website/assets/115714095/d0155f80-a570-4447-b897-f4a972aacbe2)

![ScreenShot_20240328155554](https://github.com/Harman8815/Kakashi-Website/assets/115714095/867dc8b6-38b8-4bbe-b5fc-eea26f973feb)

## 🤵 Link

  [click here](https://kakashi-animated-v2.netlify.app/)

         

## 🤵 Owner

- **Name:** [Harman Deep Singh]

- **GitHub:** [Harman88157](https://github.com/Harman8815)

## 🚀 Technologies Used

- **Languages:** HTML, CSS, JavaScript

- **Libraries:** GSAP (GreenSock Animation Platform)

## ⚙️ Setup Instructions

**Prerequisites:**

   - Open the `index.html` file in a web browser.

   - Ensure JavaScript is enabled in your browser.

   - For the tilt effect, use a laptop with a mouse or an Android device with a gyroscope.

## 🌀 Features

1. Animated introduction with GSAP animations.

2. Tilt effect that responds to mouse movements on laptops.

3. Tilt effect that responds to gyroscope movements on Android devices.

4. Interactive design elements and transitions.

## 🕹️ How to Use

1. Open the Kakashi website in a compatible web browser.

2. Explore the animated introduction and design elements.

3. Experience the tilt effect by moving your mouse (laptop) or device (Android) gently.

Enjoy the immersive experience of the Animated Kakashi Website!