My apologies if this is posted twice.

I'm having some problems using the magnifier ui.  Everything seems to
work for one div of images however if I add another div of images the
script does not work as expected.  For the second div the image zooms
in when the mouse is not even close to the image.  I have posted the
sample code below
and a link to the sample http://www.kikesweb.com/pos/magnifiertest.html

http://www.kikesweb.com/pos/magnifiertest.html

<html>
        <head>
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript" src="jquery.dimensions.js"></script
        <script type="text/javascript" src="ui.mouse.js"></script>
        <script type="text/javascript" src="ui.magnifier.js"></script>
        </head>
        <script type="text/javascript">
/*Magnifier*/
jQuery(document).ready(function(){
        $("#example").magnifier({
                overlap:true,
                magnification:2,
                zindex:'3',
                opacity:{min:'0.6', max:'1'},
                distance:'20',
                baseline:0,
        });
});

</script>

<script type="text/javascript">
jQuery(document).ready(function(){
                $("#secondary").magnifier({
                overlap:true,
                magnification:2,
                zindex:'3',
                opacity:{min:'0.6', max:'1'},
                distance:'20',
                baseline:0,
        });
});
</script>
<body>
<div class="playground">
        <div id="example">
                         images/mustang.jpg
                         images/camaro.jpg
                         images/plants.jpg
        </div>
</div>
<p>
<BR>
<div class="playground">
        <div id="secondary" class="ui-wrapper example" style="width:
 150px;padding:
20px; height: 150px;">
                         images/mustang.jpg
                         images/camaro.jpg
                         images/plants.jpg
        </div>
</div>

</body>
</html

-Enrique-

Reply via email to