资源描述:
《更清晰f放大效果》由会员上传分享,免费在线阅读,更多相关内容在行业资料-天天文库。
1、更清晰的f放大效果.img_warp{width:318px;_height:199px;_overflow:hidden;border:1pxsolid#ccc;padding:0px;margin-left:0px;margin-top:0px;position:absolute;top:0px;left:0px;}.img_warp{position:relative;top:0px;left:0px;/*cursor:crosshair*/}.img_warp.cur
2、rent{width:318px;height:199px}var$E=function(opts){function_(objId){return(typeofobjId==="string")?document.getElementById(objId):objId;}varbeImg,expand,clip,cover,warp,expImg;varclipWidth,clipHeight;varcloseTimeId=null;varm
3、ult=1;//图片放大倍数,根据裁剪框和放大后图片容器的大小自动调整//init(function(){beImg=_(opts.berviary);warp=beImg.parentNode;cover=document.createElement("div");warp.appendChild(cover);cover.style.position="absolute";cover.style.top="0px";cover.style.left="0px";cover.style.backgroundColor
4、="#ccc";varopac=parseFloat(opts.opacity)
5、
6、0.3;cover.style.opacity=opac;cover.style.filter="Alpha(Opacity="+opac*100+")";cover.style.width="100%";cover.style.height="100%";cover.style.zIndex=2;cover.style.visibility="hidden";clip=document.createElement("img");war
7、p.appendChild(clip);clipWidth=(opts.clip&&opts.clip.width)
8、
9、"60px";clipHeight=(opts.clip&&opts.clip.height)
10、
11、"60px";clip.src=beImg.src;clip.className=beImg.className;clip.style.position="absolute";clip.style.top="0px";clip.style.left="0px";clip.style.clip="rect(
12、0px,"+clipWidth+","+clipHeight+",0px)";clip.style.backgroundColor="#ccc";clip.style.zIndex=3;//ie里面会变态的自动设置宽度和高度clip.removeAttribute("width");clip.removeAttribute("height");})();functionlayerPos(e){if(e.layerX&&e.layerY){return{x:e.layerX,y:e.layerY};}else{retur
13、n{x:e.x,y:e.y};}}functionabsolutePos(e){if(e.pageX&&e.pageY){return{x:e.pageX,y:e.pageY};}else{varx=e.clientX+(document.documentElement.scrollLeft?document.documentElement.scrollLeft:document.body.scrollLeft);vary=e.clientY+(document.documentElement.scrollTop?do
14、cument.documentElement.scrollTop:document.body.scrollTop);return{x:x,y:y};}}varshowExpand=function(x,y,e){if(!expand){initExpand();}expImg.style.left=(-1*x)*mult+"px"