Skip to content

Latest commit

Β 

History

8 Commits

Folders and files

NameName
Last commit message
Last commit date
Β 
Β 
Β 
Β 

Repository files navigation

πŸŽ‰ Modal Window Magic ✨

Welcome to Modal Window Magic! This project showcases an interactive modal window that enhances user experience on your web pages. Perfect for notifications, information displays, or any engaging content you want to highlight.

🌟 Features

  • Multiple Modals: Open different modal windows with a single click!
  • Smooth Transitions: Experience seamless appearance and disappearance of modals.
  • Accessibility: Close the modal using the ESC key for better accessibility.
  • Responsive Design: Looks great on all devicesβ€”desktop, tablet, and mobile!

πŸš€ Getting Started

Follow these simple steps to set up the project locally:

1. Clone the Repository

git clone https://github.com/Nalan-PandiKumar/Modal.git
cd Modal

2. Open the HTML File

Open index.html in your favorite browser and enjoy the modal experience!

πŸ“œ How It Works

The modal functionality is powered by vanilla JavaScript, CSS, and HTML. Here’s a quick breakdown of how it operates:

  • Opening the Modal: When any of the buttons are clicked, the modal appears with a delightful transition.
  • Closing the Modal: The modal can be closed by clicking the 'Γ—' button, clicking outside the modal on the overlay, or pressing the ESC key.

πŸ’» Technologies Used

  • HTML5
  • CSS3
  • JavaScript ES6+

πŸ”§ Customization

Feel free to customize the modal appearance and functionality:

  • Change the background colors and text styles in style.css.
  • Add more content to the modal in index.html.
  • Expand JavaScript functionality in script.js to make the modal even more interactive!

🀝 Contributing

We love contributions! If you have suggestions or improvements, please fork the repository and create a pull request.

πŸ“« Contact

For any questions, feel free to reach out:

🎊 Enjoy the Magic!

Thank you for checking out Modal Window Magic! We hope it adds some sparkle to your web projects. ✨

About

No description, website, or topics provided.

Resources

Stars

6 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages