Expanding Cards

This is a simple, web-based project that showcases expanding cards. The feature allows images to expand when you hover over them, providing an interactive and visually pleasing experience. The project is built using HTML, CSS, and JavaScript.

Check it out: https://idyllic-sable-72e3d8.netlify.app/

Project Structure

• index.html: This is the main HTML file that structures the webpage. It consists of several div elements with the class "panel" which will act as the expanding cards.

• style.css: This file contains all the styling for the webpage. It gives the webpage its sleek, modern look and handles the transition effect of the expanding cards.

• script.js: This is where all the magic happens. This JavaScript file listens for "mouseover" events on the panels and adds the "active" class to the panel that the mouse is over.

Getting Started

To get a local copy up and running, follow these steps:

1. Clone the repository:

   git clone https://github.com/nreispai/expanding-cards.git
   

2. Open the index.html file in your web browser.

Enjoy it!