Skip to content

Learnermeet/Expanding-Cards

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Holiday Expanding Cards

A simple, interactive showcase of holiday destinations. Click any card to expand it and get a closer look, the others shrink back and fade to grayscale so your focus stays on the one you picked.

What's going on here

Five destination cards (Santorini, Maldives, Swiss Alps, Bali, Amalfi Coast) sit side by side. One starts expanded by default. Click another and it smoothly takes the spotlight while the rest collapse. The layout stacks vertically on smaller screens so it works on mobile too.

How to run it

Open index.html in your browser. No build step, no npm, nothing fancy. Just double-click the file or serve it however you like.

What’s inside

  • index.html – Structure and card content
  • style.css – Layout, colors, transitions, and responsive behavior
  • script.js – Click handling and toggling the active card

Images are pulled from Unsplash, so you’ll need an internet connection for them to load.


Made with ♥ by Meet Parmar

Releases

No releases published

Packages

 
 
 

Contributors