Overview
Zoom Image is a versatile and lightweight headless library designed to enable image zoom functionality on the web. It provides a seamless user experience commonly found in e-commerce sites. With examples available for Preact, React, Svelte, Vanilla JS, and Vue, Zoom Image offers a range of features to enhance image interactions.
Features
- Zoom on wheel (scroll & pinch)
- Zoom on hover
- Zoom on move
- Zoom on click
Installation
To install the Zoom Image library, follow these steps:
- Change all versions from “latest” to “workspace*” inside the example project.
- Run
pnpm install
to install the necessary packages. - Choose the command corresponding to the desired project:
- For Preact:
command
- For React:
command
- For Remix:
command
- For Next:
command
- For Svelte:
command
- For Vanilla JS:
command
- For Vue:
command
- For Solid:
command
- For Qwik:
command
- For Preact:
Summary
Zoom Image is a valuable framework-agnostic library that facilitates image zooming functionality on websites, particularly beneficial for e-commerce platforms. With support for various libraries and languages, it offers a seamless user experience with features like zoom on wheel, hover, move, and click. Additionally, the library is inspired by relevant projects and is licensed under MIT © Nam Nguyen.