LiteZoom Demo

LiteZoom is a really simple magnifier script. Hover on following images to see the demos. To use LiteZoom, just include litezoom.js in your <head> and then adapt one of those examples to your need.


    <script src="litezoom.js" type="text/javascript"></script>

Classic magnify (x2):


        <a href="small.jpg" rel="litezoom">

        <img src="small.jpg" alt="Just a picture" />

        </a>

Magnify x5:


        <a href="small.jpg" rel="litezoom[5]">

        <img src="small.jpg" alt="Just a picture" />

        </a>

Magnify using a bigger image (x1):


        <a href="big.jpg" rel="litezoom[1]">

        <img src="small.jpg" alt="Just a picture" />

        </a>

Magnify using a bigger image (x0.5):


        <a href="big.jpg" rel="litezoom[0.5]">

        <img src="small.jpg" alt="Just a picture" />

        </a>

Magnify with custom style:


        <a class="custom" href="big.jpg" rel="litezoom">

        <img src="small.jpg" alt="Just a picture" />

        </a>


        .custom #liteZoomMagnifier, .custom img {

            border: 2px dashed red;

        }