Customizable Magnifying Glass Image Zoom Plugin - blowup.js

Customizable Magnifying Glass Image Zoom Plugin - blowup.js
File Size: 7.3 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT

Just another jQuery magnifying glass zoom plugin which allows you to zoom in on a specified image with a customizable magnifying lens. Lightweight and easy to use.

How to use it:

1. After downloading jQuery blowup.js plugin, just include the JavaScript file blowup.js right above the closing body tag:

<script src="//"></script>
<script src="lib/blowup.js"></script>

2. And then initialize the function on the img tag:


3. Customize the magnifying glass effect:


  // round magnifying glass
  round      : true,

  // width/height of magnifying glass
  width      : 200,
  height     : 200,

  // background color
  background : "#FFF",

  // border shadow
  shadow     : "0 8px 17px 0 rgba(0, 0, 0, 0.2)",

  // border styles
  border     : "6px solid #FFF",

  // displays cursor
  cursor     : true,

  // z-index
  zIndex     : 999999
  // scale factor
  scale      : 1

Change log:


  • Added scale factor


  • offset top + left fix


  • Fixed could not work with <!doctype html> HTML doctype declaration.

This awesome jQuery plugin is developed by paulkr. For more Advanced Usages, please check the demo page or visit the official website.