PDA

View Full Version : Disable zoom in Image Power Zoomer



Frank Drebin
04-08-2011, 09:51 AM
1) Script Title:
Image Power Zoomer v1.1

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex4/powerzoomer.htm

3) Describe problem:
I would like to dynamically toggle on/off the powerzoom feature, so the zoom box can be hidden/shown. I would need something like
$('#myimage').removepowerzoom();

that would the the reverse of $('#myimage').addpowerzoom().

What's the best way of achieving this?

ddadmin
04-09-2011, 05:28 PM
The easiest way is probably just to hide the magnifying glass (it's still enabled on the image, just invisible now) on demand. You can do it with something like the function in red below:


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

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

/***********************************************
* Image Power Zoomer- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

<script type="text/javascript">

jQuery(document).ready(function($){ //fire on DOM ready
$('#myimage').addpowerzoom()
})

function showhidezoom(action){
ddpowerzoomer.$magnifier.outer.css({visibility:(action=="show")? "visible" : "hidden"})
}


</script>

<body>

<img id="myimage" src="test.jpg" style="width:200px; height:150px" />

<p><a href="javascript:showhidezoom('show')">Show</a> <a href="javascript:showhidezoom('hide')">Hide</a>