Image Comparison Slider: a vanilla JavaScript component that lets users drag a handle to compare before/after images side by side.
Key features:
- CSS clip-path reveal effect (GPU-composited)
- Mouse drag, touch gestures, and full keyboard support
- ARIA slider role for screen readers
- Hover-animated labels for each side
- Responsive with 16:9 aspect ratio enforcement
- Works with any image pair, no dependencies
👉 Blog Post
👉 GitHub Repo
👉 Live Demo
Top comments (0)