Skip to content

Latest commit

 

History

History
160 lines (86 loc) · 6.9 KB

README.md

File metadata and controls

160 lines (86 loc) · 6.9 KB

🛠️ My Development Journey with HTML, CSS, and JavaScript 🛠️

🎉 Hi there! I'm excited to share my learning journey with HTML 📝, CSS 🎨, and JavaScript 💻. During my initial days of learning web development, I created several small projects to understand how these technologies work together. From building websites 🌐 and creating games 🎮 to designing footers 🔻, navigation bars 🧭, button animations 🔲, and sign-in forms 🔑 and many more, I've explored it all. Using these skills, I have progressed to developing larger and more complex websites. 🚀

Project Demo: https://nidhiupman568.github.io/CREATIVE-ANIMATED-PROJECTS/

🚀 Projects Showcase 🚀

🌐 Website Components 🌐

  • Footers 🔻: Designed various footer styles to enhance the end section of web pages.
  • Navigation Bars 🧭: Created responsive and interactive navigation bars for seamless user experience.
  • Button Animations 🔲: Experimented with different button animations to make web interactions more engaging.
  • Sign-In Forms 🔑: Developed secure and stylish sign-in forms for user authentication.
  • and many more 🎉

🎮 Fun and Interactive Projects 🎮

  • Simple Websites 🌟: Built small websites to practice layout design and content organization.
  • Mini Games 🎮: Created interactive games to learn and implement game logic using JavaScript.
  • and many more 🚀

🛠️ Technologies Used 🛠️

  • HTML 📝: For structuring the content on the web pages.
  • CSS 🎨: For styling and enhancing the visual appeal of the web pages.
  • JavaScript 💻: For adding interactivity and dynamic behavior to the web pages.

🚀 How to Use 🚀

  1. Clone the repository: https://github.com/nidhiupman568/CREATIVE-ANIMATED-PROJECTS.git
  2. Open index.html in your web browser to view the projects.

📸 Screenshots (Output) 📸

  1. 🎨 Animated Search Bar

ANIMATED

  1. ✍️ Auto Text Effect Animation

AUTO

  1. 🖼️ Background Image Scroll Effect

BGD IMAGE

  1. 🎥 Background Video

BGD VIDEO

  1. 🌫️ Blurred Background Popup

BLURRED

  1. 🌊 Button Ripple Effect

RIPPLE

  1. 🎲 Dice Roll Simulator

DICE ROLL

  1. 🌐 Double Landing Page

DOUBLE LAND

  1. 🥁 Drum Kits

DRUM

  1. 😃 Emoji Rating

EMONJI

  1. 🗣️ Feedback UI

FEEDBACK

  1. ⏳ Loading Bar

LOADING

  1. 📅 Mini Calendar

MINI CAL

  1. 📆 Month Calendar

MONTH

  1. 🖱️ Mouse Event

MOUSE

  1. ✖️ Multiplication App

MULTIPLICATION

  1. 🎶 Music Player

MUSIC

  1. 🎉 New Year Countdown

NEW YEAR

  1. 🖼️ Photo Gallery

photo gallery

  1. 📊 Profile Statistics

statics

  1. ❓ Q and A Section

qa

  1. 🤪 Random Emoji

random

  1. 📸 Random Photos

random photos

  1. 📝 Random Quote Generator

quote

  1. 📚 Recipe Book App

recipe book

  1. 🔄 Rotating Image Gallery

rotating

  1. 🚶 Step Progress Bar

progress

  1. 🎥 Video Trailer Popup

trailor 1

trailor 2

trailor 3

  1. ⚖️ Weight Converter

weight

🌟 Enjoy Exploring! 🌟

Feel free to explore my projects and see the progression from simple components to complete websites. Your feedback is always welcome! If you'd like to contribute or suggest improvements, please make a pull request. Happy coding! 🎉

Explore and enjoy the world of web development with these foundational projects! 🚀💻🌐