Magic Zoom™ New! v4.0

Magic Zoom™ is a JavaScript zoom tool. It's the best way to display images in incredible detail. Try more examples. See the installation instructions.



Features

  • Fast – fast-loading thanks to the lightweight script.
  • Easy – add it to your website in only 5 minutes!
  • Customisable – change the size, position, colors and more.
  • Feels great – people love the smooth effects, close-up zoom.
  • iPad / iPhone – works beautifully on iOS and Android devices.
  • Unrivalled – fresh new releases for 6 years running.
  • Free support - need help? Email us.

Examples – 9 more examples of what is possible.

Customisation – 51 easy JavaScript parameters + 24 more examples.

Wizard – fast way to choose your perfect settings.

Compatibility

Only the best will do. Magic Zoom™ is XHTML compliant, CSS compliant, WAI Priority 3 Compliant (AAA). It even works if JavaScript is disabled – the large image opens as a link.

Browser compatibility chart
Win Mac Linux
iPhone/iPad - Yes -
Internet Explorer 9 Yes - -
Internet Explorer 8 Yes - -
Internet Explorer 7 Yes - -
Internet Explorer 6 Yes - -
Internet Explorer 5.5 Partial - -
Firefox 8 Yes Yes Yes
Firefox 7 Yes Yes Yes
Firefox 6 Yes Yes Yes
Firefox 5 Yes Yes Yes
Firefox 4 Yes Yes Yes
Firefox 3.6 Yes Yes Yes
Firefox 3.5 Yes Yes Yes
Firefox 3 Yes Yes Yes
Firefox 2 Yes Yes Yes
Firefox 1 Yes Yes Yes
Chrome 14 Yes Yes Yes
Chrome 13 Yes Yes Yes
Chrome 12 Yes Yes Yes
Chrome 11 Yes Yes Yes
Chrome 10 Yes Yes Yes
Chrome 9 Yes Yes Yes
Chrome 8 Yes Yes Yes
Chrome 7 Yes Yes Yes
Chrome 6 Yes Yes Yes
Chrome 5 Yes Yes Yes
Chrome 4 Yes Yes Yes
Chrome 3 Yes Yes Yes
Safari 5 Yes Yes -
Safari 4 Yes Yes -
Safari 3 Yes Yes -
Opera 11 Yes Yes Yes
Opera 10 Yes Yes Yes
Opera 9 Yes Yes Yes
Opera 8 Yes Yes Yes
Konqueror 3.2+ - - Yes

FAQ

QHow do you change the size of the grey window?

AThe size of the hover area is determined automatically by 3 factors. Change these 3 things and the size will change:
  1. The size of your large image.
  2. The size of your small image.
  3. The size of the zoomed area to the right.

Q What size should my images be?

A A small image size of 250-300px works well with a large image size of 750-1000px. The blue bike example above uses a small image width of 320px and a large image width of 974px.

Q Why has my dropdown menu started flickering?

A If you use a dropdown menu, it needs to have some code to combat an IE bug. This bug is sometimes seen after you install Magic Zoom™, though it is actually caused by the dropdown menu. To fix it, you need to delay the execution of the "mouseout" behaviour of your menu for 20-100ms.

Q A Flash object is on top of the zoomed image.

A The most common solution is to set the "wmode" parameter of the Flash object to "transparent" like so:
  1. Add <param name="wmode" value="transparent" /> inside the <object></object>.
  2. If the <embed> tag is present, add this attribute to it: wmode="transparent".
  3. Your code will look something like this:
    <object>
    <param name="wmode" value="transparent" />
    <embed wmode="transparent" />
    </object>

Q Where can I find mz-packed.js?

A The file mz-packed.js (previously lz-packed.js) has been renamed magiczoom.js. It is the JavaScript file which comes bundled with Magic Zoom™. To get it, purchase Magic Zoom™ or download the free trial version.

Q Why is there an error in IE8 strict mode?

A If you use a .png fix for the IE6 browser, it might cause a JavaScript error when viewing in IE8 strict (not compatibility mode). To stop the error, move the .png fix into an IE6 override file, starting with <!--[if IE 6]>.

Version history

Magic Zoom™ version 4.0
October 11, 2011 – big new features:

  • Works on iOS (iPad/iPhone) and Android;
  • Hint indicates image is zoomable;
  • Drop shadow and glow effects;
  • Initialization (download) on hover to save data transfer;
  • Zoom alignment option;
  • Show titles with inner zoom;
  • External source of a title;
  • Hide zoom on click;
  • CSS class for active selector;
  • Optional right-click show menu;
  • New API show method;
  • Automatically re-position zoom window if it goes beyond page boundaries;
  • New pounce effect to switch between multiple images.

Magic Zoom™ version 3.1
October 26, 2009 – dissolve and cross-fade effect; change title position; show entire image on hover; define options once or for each different zoom.

Magic Zoom™ version 3.0
September 2, 2009 – massive new features: activate zoom on click; load large image on click; slow-motion zoom; fade in/out effect; reverse opacity effect; custom settings for each image; improved drag-mode (choose initial position, preserve position; new API functions; settings wizard to help you customise it.

Magic Zoom™ version 2.2
July 9, 2008 – Improved IE support when scrolling.

Magic Zoom™ version 2.1
May 27, 2008 – Loading message with AJAX-style animated GIF added while large image is downloading. Support for a separate title for each image zoom (when multiple images used).

Magic Zoom™ version 2.0
February 14, 2008 – All code improved wherever possible. Easier implementation, more customisation options, fully accessible (degrades gracefully without JavaScript). We're really pleased with this new version – let us know what you think too!

Magic Zoom™ version 1.0
December 1, 2007 – Thanks to all the great feedback we've received, we've now built a dedicated website for Magic Zoom™ and our growing range of products.

Lucky Zoom version 1.0
May 14, 2006 – LuckyZoom is a JavaScript image zoom effect for high resolution images. Cross browser (Firefox, Internet Explorer, Opera, Safari). Lean code. HTML and XHTML compliant. Customisation effects.

Pricing

1 site license £29 Buy now
5 sites license £95 Buy now
10 sites license £175 Buy now
Unlimited license £395 Buy now
Bundled license £899 Buy now
Installation service (optional) £29

Pay by credit card, bank transfer or cheque. Download your product immediately after you pay and start using it!

The £ amount will be automatically converted to your currency.

Payments: Visa, MasterCard, Maestro, Amex, Discover, Paypal, Google Checkout, Avangate