javascript 图片放大效果函数

/* 
*Author:sohighthesky 
*Date:2009-11-14 
*/ 
/* 
*img 指定要放大的图片或者其id 
*options:参见代码中setOptions中的注释 
*/ 
var imageZoom = function(img,options) { 
    this.img=this.g(img); 
    if(this.img.nodeName!="IMG") { 
        if(this.img && this.img.children[0].nodeName=="IMG")this.img=this.img.children[0]; 
        else throw Error("Invalid argument [img] !"); 
    } 
    this.setOptions(options); 
    this.init(); 
} 
imageZoom.prototype={ 
    g:function(id) {return typeof(id)=="string"?document.getElementById(id):id;}, 
    ae:function(el,type,call) { 
if(el.addEventListener)el.addEventListener(type,call,false); 
        else el.attachEvent("on" type,call); 
}, 
    getPos:function(o){//取元素坐标 
        var x = 0, y = 0; 
        do{x  = o.offsetLeft; y  = o.offsetTop;} 
        while(o=o.offsetParent); 
        return {'x':x,'y':y}; 
    }, 
    setOptions:function(options) { 
     this.options={ 
     mul:0,//默认为不放大（显示图片的原来大小） 
         bigImg:null,//指定放大的图片路径（要跟小图成比例才好） 
         viewer:null, //指定显示的位置(可以为一个div或者其id) 
         viewerCla:"",//预览的div的类样式 
         viewerMul:1,//指定显示div的放大倍数，默认为原大小,设置viewer时此参数无效 
         onShow:function(){}, 
         onHide:function(){} 
     }; 
        for(var o in options) {this.options[o]=options[o];} 
        this.options.bigImg =this.options.bigImg ||this.img.src; 
}, 
getSize:function(o) { 
        return {w:o.offsetWidth,h:o.offsetHeight}; 
}, 
    createView:function() {         
        var _is=this.getSize(this.img); 
        var d=document; 
        if(this.options.viewer){ 
            this.viewer=this.g(this.options.viewer); 
            this.viewer.style.overflow="hidden"; 
            this.viewer.style.position="relative"; 
        } else { 
            this.viewer=d.createElement("div"); 
            this.viewer.className=this.options.viewerCla; 
            var pos=this.getPos(this.img); 
            this.viewer.style.cssText="display:none;overflow:hidden;position:absolute;top:" pos.y "px;left:" (pos.x _is.w 10) "px;height:" _is.h*this.options.viewerMul "px;width:" _is.w*this.options.viewerMul "px"; 
            d.body.appendChild(this.viewer); 
        }         
        this.viewimg=d.createElement("img"); 
        this.viewimg.style.cssText="position:relative;left:-33%;top:-33%;"; 
        this.viewimg.src=this.options.bigImg; 
        if(this.options.mul) {//设置放大倍数 
            this.viewimg.style.width=_is.w*this.options.mul  "px"; 
            this.viewimg.style.height=_is.h*this.options.mul  "px"; 
        } 
        this.viewer.appendChild(this.viewimg); 
    }, 
    move:function(e) { 
        if(!this.options.mul) 
         this.options.mul=this.viewimg.offsetHeight/this.img.offsetHeight; 
        var pos=this.getPos(this.img); 
        var l=e.clientX-pos.x (document.documentElement.scrollLeft || document.body.scrollLeft);//鼠标位置相对于图片左上角的偏移 
        var t=e.clientY-pos.y (document.documentElement.scrollTop || document.body.scrollTop); 
        var zs=this.getSize(this.viewer); 
        var pl=-l*this.options.mul zs.w/2; 
        var pt=-t*this.options.mul zs.h/2; 
        pl=pl>0?0:pl; 
        pt=pt>0?0:pt; 

var vs=this.getSize(this.viewimg); 
pl=Math.max(pl,zs.w-vs.w); 
pt=Math.max(pt,zs.h-vs.h); 

        this.viewimg.style.left=pl "px"; 
        this.viewimg.style.top=pt "px"; 
    }, 
    init:function() { 
     var o=this; 
     var load=function(a) {//图片加载 
     o.createView.call(o); 
     o.img.setAttribute("alt",""); 
     o.ae(o.img,"mousemove",function(event){o.move.call(o,event);}); 
         if(!o.options.viewer) { 
         o.ae(o.img,"mouseover",function(){o.options.onShow();o.viewer.style.display=""}); 
         o.ae(o.img,"mouseout",function(){o.options.onHide();o.viewer.style.display="none"}); 
         } 
     }; 
     if(typeof(document.readyState)=="undefined" || window.opera) { 
            var de=document.documentElement || document.body; 
            var h=de.scrollHeight; 
            var t=setInterval(function() { 
                if(h==de.scrollHeight){ 
                    clearInterval(t); 
                    load();                     
                } else h=de.scrollHeight; 
            },500); 
     } else if(document.readyState=="complete") 
     load(); 
     else 
     o.ae(window,"load",load); 
    } 
};