Component

Hotspot Carousel

A carousel of photographs where each image carries clickable hotspots: open a hotspot and a card appears. HTML, CSS and JavaScript — no framework, no build step, not a single external request.

Original scale

The component as it was drawn. Open a hotspot on the image, change view with the thumbnails, the arrows, the keyboard or a swipe of the finger.

Settings

These buttons do not belong to the component: they set data-* attributes and CSS variables on the carousel above, exactly as your own page would.

Thumbnails
Thumbnail format
Halo on the hotspots
Automatic scrolling
Scale