function div(id){return document.getElementById(id);}
var ie=!-[1,];
var Obj={
Create:function(id,id2,ele){
var obj=document.createElement(ele);
obj.setAttribute("id",id2);
div(id).appendChild(obj);
},
del:function(id){
var obj=div(id);
obj.parentNode.removeChild(obj);
},
inner:function(id,text){
div(id).innerHTML=text;
},
css:function(){
this.cssinfo();
var obj=div(this.css.id);
with(obj.style){
ie?(this.css.float!=undefined?styleFloat=this.css.float:""):(this.css.float!=undefined?cssFloat=this.css.float:"");
this.css.background!=undefined?background=this.css.background:"";
this.css.width!=undefined?width=this.css.width:"";
this.css.height!=undefined?height=this.css.height:"";
this.css.position!=undefined?position=this.css.position:"";
this.css.left!=undefined?left=this.css.left:"";
this.css.top!=undefined?top=this.css.top:"";
this.css.padding!=undefined?padding=this.css.padding:"";
this.css.margin!=undefined?margin=this.css.margin:"";
this.css.filter!=undefined?filter=this.css.filter:"";
this.css.opacity!=undefined?opacity=this.css.opacity:"";
this.css.zIndex!=undefined?zIndex=this.css.zIndex:"";
this.css.border!=undefined?border=this.css.border:"";
this.css.overflow!=undefined?overflow=this.css.overflow:"";
this.css.display!=undefined?display=this.css.display:"";
this.css.textAlign!=undefined?textAlign=this.css.textAlign:"";
this.css.fontSize!=undefined?fontSize=this.css.fontSize:"";
this.css.color!=undefined?color=this.css.color:"";
this.css.verticalAlign!=undefined?verticalAlign=this.css.verticalAlign:"";
this.css.cursor!=undefined?cursor=this.css.cursor:"";
}
},
oEventX:function(e){
var e=window.event?window.event:e;
return e.clientX;
},
oEventY:function(e){
var e=window.event?window.event:e;
return e.clientY;
}
}
var Create=Obj.Create,inner=Obj.inner,del=Obj.del,oX=Obj.oEventX,oY=Obj.oEventY;
Obj.css.prototype.cssinfo=function(){
this.css=css;
return this;
}
*{margin:0;padding:0;font:12px/1.5em "宋体"}
.imgs{font-size:0;line-hegiht:0;}
.imgwrap{overflow:hidden;zoom:1;margin:100px;float:left;border:1px solid #e0e0e0;display:inline;}
.imgwrap .imgs{display:block;}
.imgwrap .imgs img{width:300px;}
function imgzoom(){
var container="imgwrap"/*容器ID*/,imgload="img_loader"/*鼠标捕捉框ID*/,imgshow="img_shower"/*大图展示ID*/,showerL=320/*大图展示位置*/,showerT=0/*大图展示位置*/,navbug=200/*鼠标位置校正,当改变图片位置时候需要调整*/;
var il_w=120,il_h=120,v=2.25/*捕捉框大小以及放大倍数*/;
css={id:container,position:"relative",overflow:"visible",cursor:"crosshair"}
new Obj.css;
var imgs=div("imgwrap").getElementsByTagName("img");
for(i=0;i if(imgs.className=="izoom"); imgs[i].onmouseover=function(){Start(arguments[0],this)}; } function Start(e,o){ o.onmouseover=""; Create(container,imgload,"div"); Create(container,imgshow,"div"); var image=new Image(),o2=div(imgload); image.src=o.src; var h=image.height,w=image.width; var h1=o.height,w1=o.width; var MouseX=oX(arguments[0]),MouseY=oY(arguments[0]),parentX=o.offsetWidth-o.style.border*2,parentY=o.offsetHeight; var img=""; css={id:imgload,width:il_w+"px",height:il_h+"px",border:"1px solid #300",position:"absolute",background:"#fff",opacity:"0.3",filter:"alpha(opacity='30')"} new Obj.css; inner(imgshow,img); css={id:imgshow,width:il_w*v+"px",height:il_h*v+"px",position:"absolute",left:showerL+"px",top:showerT+"px",overflow:"hidden"} new Obj.css; css={id:"objzoom",position:"absolute"} new Obj.css; ie?o.attachEvent('onmouseover',MouseM):o.addEventListener('mouseover',MouseM,false); ie?o.attachEvent('onmousemove',MouseM):o.addEventListener('mousemove',MouseM,false); ie?o2.attachEvent('onmousemove',MouseM):o2.addEventListener('mousemove',MouseM,false); ie?o2.attachEvent('onmouseout',clearadd):o2.addEventListener('mouseout',clearadd,false); function MouseM(){ var sizeX=(oX(arguments[0])-(il_w+2+navbug)/2),sizeY=(oY(arguments[0])-(il_h+2+navbug)/2); var vX=sizeX>=0?(sizeX+(il_w+2)/2<=parentX-(il_w+2)/2?sizeX:(parentX-(il_w+2))):0,vY=sizeY>=0?(sizeY+(il_h+2)/2<=parentY-(il_h+2)/2?sizeY:(parentY-(il_h+2))):0; css={id:imgload,left:vX+"px",top:vY+"px"} new Obj.css; css={id:"objzoom",left:-vX*v+"px",top:-vY*v+"px"} new Obj.css; } function clearadd(){ setTimeout(clearall,10) function clearall(){ del(imgshow);del(imgload); o.onmouseover=function(){Start(arguments[0],this)}; } } } } imgzoom();