React Inner Image Zoom Component
Great for ecommerce product images! An open source React component for magnifying an image within its original container.
View on Github- Details
- Zoom on click or hover
- Move by dragging on touch devices and dragging or panning on hover on non-touch devices
- Supports responsive images
- Can be used with other popular React components
- Photo credit: Micheile Henderson on Unsplash
Quick Start
Install:
npm install react-inner-image-zoom
Style:
Grab styles.css from Github or
import 'react-inner-image-zoom/lib/InnerImageZoom/styles.css'Import:
import InnerImageZoom from 'react-inner-image-zoom'Render:
<InnerImageZoom src="/path/to/image.jpg" />