MARKETPLACE
PLUGINS
IMAGE ZOOM ON HOVER
Image Zoom on Hover logo

Image Zoom on Hover

Published November 2025
   •    Updated November 2025

Plugin details

***Try it here: https://netdigitaltech.com/Image_zoom_on_hover ***   This Bubble plugin provides a high-quality, canvas-based image zoom and magnifier functionality. It allows users to inspect details of a main image by hovering a custom lens over it, displaying a perfectly scaled, enlarged view in a separate result area.
**Features:**

High-Definition Zoom: Provides ultra-sharp magnification that keeps image details crisp and clear (no blurriness or pixelation).

Fully Customizable Lens: Easily change the size, shape (circle/square), and border of the magnifier to match your design.

Dynamic Image Ready: Automatically adapts when the main image changes (e.g., product variant selection) without refreshing.

Touchscreen Support: Works flawlessly on mobile phones and tablets (optimized for touch and drag).

Flexible Output Placement: The magnified view can be placed in any separate container on your page.

Optimized for Performance: Built with efficient code to prevent memory leaks and ensure smooth operation.

$2

Per month

stars   •   0 ratings
0 installs  
This plugin does not collect or track your personal data.

Platform

Web

Contributor details

NetDigitalTech logo
NetDigitalTech
Joined 2022   •   50 Plugins
View contributor profile

Instructions

🚧 Installation & Usage Instructions 🚧
Here's a concise, step-by-step guide for setting up the Image Magnifier plugin:

1. Add the Plugin: Drag the "Image Zoom Magnifier" element onto your Bubble page. This is the controller.

2. Define the Image ID: Select the Bubble Image element you want to zoom and assign it a unique ID Attribute (e.g., product-photo).

3. Define the Output ID: Create an empty Group element (this is where the zoom appears) and assign it a unique ID Attribute (e.g., zoom-window).

4. Link the Elements (Plugin Properties):

Set Image Element ID to your image's ID (product-photo).

Set Zoom Result ID to your group's ID (zoom-window).

5. Set Zoom Power: Define the magnification level using the Zoom Factor (e.g., 2.5).

6. Style the Lens: Adjust Lens Width/Height, Border Radius (use 50 for a circle), and Border Color to customize the appearance of the moving magnifier.

Types

This plugin can be found under the following types:
Element   •   Event

Categories

This plugin can be found under the following categories:
Image   •   Media   •   Visual Elements

Resources

Support contact
Documentation
Tutorial

Rating and reviews

No reviews yet

This plugin has not received any reviews.
Bubble