// This goes in the <head> </head> section

****************************************************************************************


<script language="JavaScript">
<!--

/* X-ray mouse script by Paul Anderson, copyright 2001 CNET Builder.com.
   May be freely used with attribution. Not for resale. */

var divX,divY,swtDiv,showWidth,showHeight;
showWidth=100;
showHeight=80;

function initEvents() {
	swtDiv=document.getElementById?document.getElementById("swtHidden"):document.all?document.all["swtHidden"]:document.layers?document.layers["swtHidden"]:null;
	if (document.layers) {
		swtDiv.style=swtDiv;
		document.captureEvents(Event.MOUSEMOVE);
		}
	if (swtDiv) {
		document.onmousemove=doMouse;
		}
	}
window.onload=initEvents;

function doMouse(arg) {
	ev=arg?arg:event;
	divX=(ev.pageX?ev.pageX:ev.clientX)-parseInt(swtDiv.style.left);
	divY=(ev.pageY?ev.pageY:ev.clientY)-parseInt(swtDiv.style.top);
	if (swtDiv.clip) {
		/* Nav 4 bugs addresed here: clip outside layer deactivates links,
		 event.pageX|pageY of zero evaluates as NaN. Go figure. */
		swtDiv.clip.left=(divX>showWidth/2)?divX-showWidth/2:0;
		swtDiv.clip.top=(divY>showHeight/2)?divY-showHeight/2:0;
		newRight=(isNaN(divX)?0:divX)+showWidth/2;
		maxRight=swtDiv.document.images[0].width;
		swtDiv.clip.right=(newRight<maxRight)?newRight:maxRight;
		newBottom=(isNaN(divY)?0:divY)+showHeight/2;
		maxBottom=swtDiv.document.images[0].height;
		swtDiv.clip.bottom=(newBottom<maxBottom)?newBottom:maxBottom;
	} else {
		swtDiv.style.clip="rect("+(divY-showHeight/2)+" "+(divX+showWidth/2)+" "+(divY+showHeight/2)+" "+(divX-showWidth/2)+")";
	}
}
//-->
</script>



****************************************************************************************

This goes between <body> </body>

<div style="top:75;left:75;position:absolute;">
<img src="image1.jpg" width=350 height=250>
</div>
<div style="top:75;left:75;position:absolute;clip:rect(0 0 0 0);" id="swtHidden">
<img src="image2.jpg" width=350 height=250>
</div> 