Zoom Effect (Caribbean)

Frame Effect (Mona Lisa)

X-Ray Effect (Homer)

Images used are copyrighted and are used for demonstration only.

Download loupe.js and include it into your webpages HEAD section.

// only if the image "loupe.png" is not in the current path
<scriptscript type="text/javascript">var loupePath="imagepath/";</script>
// else only this lines...
<script type="text/javascript" src="loupe.js"></script>
<!--[if gte IE 6]>
<scriptscript type="text/javascript">var loupePath="vml/";</script>
<script type="text/javascript" src="vml/loupe.js"></script>
<![endif]-->

To add a loupe just set the event onload="initLoupe(this.id);" to an div surrounded image.

<div>
<img id="..." onLoad="initLoupe(this.id);" src="..." width="356" height="205" alt="...">
</div>

• Function initLoupe(arg1[,arg2][,arg3][,arg4][,arg5])
• setting the image through image id:
  Required Parameter arg1 e.g. this.id or "imgname" - default=null
• setting the startup visibility of the loupe:
  Optional Parameter arg2 e.g. true - default=false
• setting the starting horizontal viewpoint in px for the loupe:
  Optional Parameter arg3 e.g. 0-imagewidth - default=0
• setting the starting vertical viewpoint in px for the loupe:
  Optional Parameter arg4 e.g. 0-imageheight - default=0
• setting the crosshair visibility of the loupe:
  Optional Parameter arg5 e.g. true - default=false

• Fast and easy to implement. Just add onload="initLoupe(this.id);" to the image.
• Makes large images completely visibly through small page-areas.
• Works and looks really well. Doesn't require additional resources.
• It's possible to change the design of the loupe by use of a image editing program.
• Free of charge use on non-commercial and private web sites.

In older browsers, the script degrades and your visitors won't notice a thing.

Please read the License before you download loupe.js 1.3

Please read the Frequently Asked Questions before you contact the author.

It's not advisable to use the script multiple times on the same page.

Version 1.3

• Added support for viewpoint start and crosshair

• Added support for Internet Explorer 6/7

• Works even with disabled cache

• Initial Release

Please leave any comments at this contact formular.

loupe.js and vml/loupe.js are distributed under the Netzgestade Non-commercial Software License Agreement.
License permits free of charge use on non-commercial and private web sites only under special conditions (as described in the license). This license equals neither "open source" nor "public domain". There are also Commercial Software Licenses available.

YOU AGREE TO ALL CONDITIONS OF THIS LICENCE AGREEMENT CONCERNING THE USE OF THE SOFTWARE BY ACCEPTING THIS LICENCE.
IF YOU DO NOT AGREE TO ALL CONDITIONS OF THIS AGREEMENT, YOU SHALL NOT INSTALL THE SOFTWARE, OR USE IT IN OTHER WAYS.