预览加载中，请您耐心等待几秒...

JavaScript实用的图片放大镜代码.doc

预览
1/2
2/2

在线预览结束，喜欢就下载吧，查找使用更方便

下载提示 文本预览

如果您无法下载资料，请参考说明：

1、部分资料下载需要金币，请确保您的账户上有足够的金币

2、已购买过的文档，再次下载不重复扣费

3、资料包下载后请先用软件解压，在使用对应软件打开

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <styletype="text/css"> #div1{width:304px;height:222px;position:relative;margin:30pxauto0px;} #div1img{width:304px;height:222px;} #div1span{width:100px;height:100px;background:red;left:0px;top:0px;position:absolute;display:none;filter:alpha(opacity:20);opacity:0.2;} .show{width:100%;height:100%;background:red;position:absolute;z-index:10px;filter:alpha(opacity:10);opacity:0.1;left:0px;top:0px;} #div2{width:304px;height:222px;position:relative;display:none;overflow:hidden;margin:0pxauto0px;} #img1{position:absolute;} </style> <metahttp-equiv="Content-Type"mrc="text/html;charset=gb2312"/> <title>JavaScript图片放大代码www.zhuoyueztc.com</title> <scripttype="text/javascript"> window.onload=function() { varoDiv=document.getElementById('div1'); varoShow=oDiv.getElementsByTagName('div')[0]; varoSpan=oDiv.getElementsByTagName('span')[0]; varoImg=document.getElementById('img1'); oShow.onmouseover=function() { oSpan.style.display='block'; oImg.parentNode.style.display='block'; }; oShow.onmouseout=function() { oSpan.style.display='none'; oImg.parentNode.style.display='none'; }; oShow.onmousemove=function(ev) { varoEvent=ev||event; varx=oEvent.clientX-oDiv.offsetLeft-oSpan.offsetWidth/2; vary=oEvent.clientY-oDiv.offsetTop-oSpan.offsetHeight/2; if(x<0) { x=0; } elseif(x>oShow.offsetWidth-oSpan.offsetWidth) { x=oShow.offsetWidth-oSpan.offsetWidth; } if(y<0) { y=0; } elseif(y>oShow.offsetHeight-oSpan.offsetHeight) { y=oShow.offsetHeight-oSpan.offsetHeight } oSpan.style.left=x+'px'; oSpan.style.top=y+'px'; varpercentX=x/(oShow.offsetWidth-oSpan.offsetWidth); varpercentY=y/(oShow.offsetHeight-oSpan.offsetHeight); varoImgparent=oImg.parentNode; oImg.style.left=-percentX*(oImg.offsetWidth-oImgparent.offsetWidth)+'px'; oImg.style.top=-percentY*(oImg.