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 installto 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.