471,596 Members | 948 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,596 software developers and data experts.

Adding an Activate/Deactive Button to a Javascript Function

Hi,

I'm no javascript programmer but I found a really good piece of
javascript at http://www.isdntek.com/tagbot/zipzoom.htm that magnifies
areas of an image. It's just what I want but their example only allows
for a button in the HTML body to turn the magnifier on:

<input type="button" onclick="initMagnifier()" value="Use Magnifier">

I would like two buttons; one to activate the magnifier and one to
deactivate the magnifier. How would I do that? I can see in the code
that there is a variable called `magthis' which is either true or
false. So I'm guessing that's what the buttons have to control.

Any help would be appreciated. I've included a copy of the code so that
you don't need to go to the website.

Thank you.

Dominic

******script follows*******

<script language="javascript1.2">
<!--
//-----------------------------
// Do not remove this header.
// Place this script near the top of your page.
//-------------------------------
// Image Magnifier code by
// ShipScript copyright 2006 ISDN*tek
// http://www.isdntek.com/etools.htm
// This code has been tested in
// Internet Explorer 6, FireFox 1,
// Netscape 7, and eBay
//-----------------------------
// you may change these two values
//-----------------------------
var magnification=3 ; //-- magnification ratio is 3X enlargement
var magviewersize=.5 ; //-- magnification viewer is 50% of the image
width
//-----------------------------
// the following javascript code
// must remain as one long sentence
// to function correctly.
//-----------------------------
// -->
</script>
<div style="font-size:1px; display:none;">zipzoom</div>
<script language="javascript1.2">
<!--
var quot="'"; var Magnifico=new Array(); var magnify=false; var
magStartX=0; var magStartY=0; function initMagnifier(){ for (im=0;
im<document.images.length; im++){ var magthis=false;
if(document.images[im].parentNode.className.indexOf("magnify_this")>=0){ magthis=true};
if(document.images[im].parentNode.href) { if
(document.images[im].parentNode.href.indexOf("initMagnifier")>=0){magt his=true}
} if( document.images[im].id.indexOf("Magnifier")>=0 ||
document.images[im].id.indexOf("Magtile")>=0 ){magthis=false};
if(magthis==true){ nextImage=document.images[im]; var
thisImageCode=nextImage.parentNode.innerHTML.subst r(0,nextImage.parentNode.innerHTML.indexOf(">"))+
' id="bgbaseimg'+im+'" galleryimg="false" oncontextmenu="return false;"
'+ ' onmouseover ="setMagnifier('+im+');" '+ ' onmouseout
="hideMagnifier('+im+'); return false" >'; if
(nextImage.style.cssFloat){var alignment=nextImage.style.cssFloat} else
if (nextImage.align) {var alignment=nextImage.align} else {var
alignment='none'} nextImage.parentNode.innerHTML= '<div
id="placeholder'+im+'" style="position:relative; left:0px; top:0px;
float:'+alignment+';'+ ' width:'+nextImage.offsetWidth+';
height:'+nextImage.offsetHeight+';"'+ ' onclick="return false">'+ '<div
id="imgholder'+im+'" style="position:absolute; left:0px; top:0px;
border:0px solid blue; overflow:hidden">'+ thisImageCode+ '<div
id=Magnifier'+im+' style="position:absolute; left:0px; top:0px; '+ '
width:'+(nextImage.offsetWidth*magviewersize)+'px;
height:'+(nextImage.offsetHeight*magviewersize)+'p x; '+ ' border:1px
solid gray; visibility:hidden; overflow:hidden; '+ ' cursor:move;
background-color:gray; " title="Move magnifier to see details"'+ '
ondrag="return false" '+ ' onmouseover ="setMagnifier('+im+'); " '+ '
onmousedown="showMagnifier('+im+',event.clientX,ev ent.clientY); return
false" '+ ' onmousemove="if (magnify==true)
{moveMagnifier('+im+',event.clientX,event.clientY) }" '+ ' onmouseup
="magnify=false; return false" '+ '><img id="Magtile'+im+'"
src="'+nextImage.src+'" style="position:absolute; '+ ' left:0px;
top:0px; width:'+nextImage.offsetWidth*magnification+';" '+ '
onmouseover="this.galleryimg='+quot+'no'+quot+'" oncontextmenu="return
false;">'+ '</div></div></div>';
Magnifico[im]=document.getElementById('Magnifier'+im);
document.getElementById('bgbaseimg'+im).style.cssF loat='none';
Magnifico[im].style.left=(document.getElementById('imgholder'+i m).offsetWidth/2)-(Magnifico[im].offsetWidth/2);
Magnifico[im].style.top=(document.getElementById('imgholder'+im ).offsetHeight/2)-(Magnifico[im].offsetHeight/2);
setMagtile(im); } } } function setMagnifier(idm){
Magnifico[idm].style.visibility='visible'; } function setMagtile(idm){
MagImg=document.getElementById('Magtile'+idm);
xx=(MagImg.offsetWidth-Magnifico[idm].offsetWidth)/
(document.getElementById('imgholder'+idm).offsetWi dth-Magnifico[idm].offsetWidth);
yy=(MagImg.offsetHeight-Magnifico[idm].offsetHeight)/(document.getElementById('imgholder'+idm).offsetHe ight-Magnifico[idm].offsetHeight);
MagImg.style.left=0-(parseInt(Magnifico[idm].style.left))*xx ;
MagImg.style.top=0-(parseInt(Magnifico[idm].style.top))*yy ; } function
showMagnifier(idm,X,Y){ magnify=true; magStartX=X; magStartY=Y; }
function moveMagnifier(idm,X,Y){
Magnifico[idm].style.left=parseInt(Magnifico[idm].style.left)+X-magStartX;
Magnifico[idm].style.top =parseInt(Magnifico[idm].style.top)
+Y-magStartY; magStartX=X; magStartY=Y; if
(Magnifico[idm].offsetLeft<=0
){magStartX=magStartX-Magnifico[idm].offsetLeft;
Magnifico[idm].style.left=0 } if (Magnifico[idm].offsetTop<=0 )
{magStartY=magStartY-Magnifico[idm].offsetTop;
Magnifico[idm].style.top=0 } var
rtlimit=document.getElementById('imgholder'+idm).o ffsetWidth-Magnifico[idm].offsetWidth;
var
btlimit=document.getElementById('imgholder'+idm).o ffsetHeight-Magnifico[idm].offsetHeight;
if (Magnifico[idm].offsetLeft>=rtlimit )
{magStartX=magStartX-(Magnifico[idm].offsetLeft-rtlimit);Magnifico[idm].style.left=rtlimit
} if (Magnifico[idm].offsetTop>=btlimit )
{magStartY=magStartY-(Magnifico[idm].offsetTop-btlimit);Magnifico[idm].style.top=btlimit
} setMagtile(idm); } function hideMagnifier(idm){
Magnifico[idm].style.visibility="hidden"; magnify=false; }
// -->
</script>

May 24 '06 #1
2 4682
do************@dtrack.com wrote:
I'm no javascript programmer but I found a really good piece of ^^^^^^^^^^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^^^^^^^^^ javascript at http://www.isdntek.com/tagbot/zipzoom.htm [...]

^^^^^^^^^^

How would you even know? Those facts are antivalent, and the junk code you
have posted definitely proves that. I will skip proving to you why it is
junk, it is just not worth that much amount of free time. Read the FAQ
instead: <URL:http://jibbering.com/faq/>.
PointedEars
--
In the First World War, 13 million people were killed. In the Second
World War, 40 million people were killed. I think that if a third war
takes place, nothing is going to be left on the face of earth.
-- Shakira, 2003-02-05 @ MTV.com
May 26 '06 #2
JRS: In article <17****************@PointedEars.de>, dated Fri, 26 May
2006 03:33:25 remote, seen in news:comp.lang.javascript, Thomas
'PointedEars' Lahn <Po*********@web.de> posted :


PointedEars
--
In the First World War, 13 million people were killed. In the Second
World War, 40 million people were killed. I think that if a third war
takes place, nothing is going to be left on the face of earth.
-- Shakira, 2003-02-05 @ MTV.com

Really, if you are going to use that quotation in your non-standards-
respecting "signature", you ought to moderate your dictatorial behaviour
in order not to give the impression that the present generation of
Germans are as obnoxious as so many of their nominal ancestors of
various previous generations. Remember Doorn.

--
© John Stockton, Surrey, UK. ??*@merlyn.demon.co.uk Turnpike v4.00 MIME. ©
Web <URL:http://www.merlyn.demon.co.uk/> - FAQish topics, acronyms, & links.

Food expiry ambiguities: <URL:http://www.merlyn.demon.co.uk/date2k-3.htm#Food>
May 27 '06 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by Weston C | last post: by
3 posts views Thread by daveland | last post: by
2 posts views Thread by RobG | last post: by
1 post views Thread by The Eclectic Electric | last post: by
reply views Thread by leo001 | last post: by
reply views Thread by Anwar ali | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.