@supermousejs/image

Displays a floating image thumbnail next to the cursor on hover.

Installation

pnpm add @supermousejs/image

Usage

import { Supermouse } from '@supermousejs/core';
import { Image } from '@supermousejs/image';

const app = new Supermouse();

app.use(Image({
  offset: [30, 30],
  smoothness: 0.1 // Lag factor for the image
}));

HTML:

<a href="#" data-supermouse-img="/path/to/image.jpg">Hover to see preview</a>

Documentation

Full documentation and interactive playground available at supermouse or check out the repo.