jquery.imagezoom.min.js 4.46 KB
function MouseEvent(e){this.x=e.pageX,this.y=e.pageY}!function($){$.fn.imagezoom=function(options){function mouseOutImage(){$(self).attr("alt",noalt),$(document.body).unbind("mousemove"),$("div.zoomMask").remove(),$("div.zoomDiv").remove()}var settings={xzoom:310,yzoom:310,offset:10,position:"BTR",preload:1};options&&$.extend(settings,options);var noalt="",self=this;$(this).bind("mouseenter",function(ev){var imageLeft=$(this).offset().left,imageTop=$(this).offset().top,imageWidth=$(this).get(0).offsetWidth,imageHeight=$(this).get(0).offsetHeight,boxLeft=$(this).parent().offset().left,boxTop=$(this).parent().offset().top,boxWidth=$(this).parent().width(),imageRotate=($(this).parent().height(),$(this).get(0).style.transform?$(this).get(0).style.transform.substring($(this).get(0).style.transform.indexOf("(")+1,$(this).get(0).style.transform.indexOf("deg)")):0);""!=$(this).get(0).style.transform&&""!=imageRotate&&!isNaN(imageRotate)&&imageRotate>0&&imageRotate/90%2==1&&(imageWidth=$(this).get(0).offsetHeight,imageHeight=$(this).get(0).offsetWidth),noalt=$(this).attr("alt");var bigimage=$(this).attr("rel");$(this).attr("alt",""),0==$("div.zoomDiv").get().length&&$(document.body).append("<div class='zoomDiv'><img class='bigimg' src='"+bigimage+"'/></div><div class='zoomMask'>&nbsp;</div>"),"BTR"==settings.position?boxLeft+boxWidth+settings.offset+settings.xzoom>screen.width?leftpos=boxLeft-settings.offset-settings.xzoom:leftpos=boxLeft+boxWidth+settings.offset:(leftpos=imageLeft-settings.xzoom-settings.offset,leftpos<0&&(leftpos=imageLeft+imageWidth+settings.offset)),$("div.zoomDiv").css({top:boxTop,left:leftpos}),$("div.zoomDiv").width(settings.xzoom),$("div.zoomDiv").height(settings.yzoom),$("div.zoomDiv").show(),$(this).css("cursor","crosshair"),$(document.body).mousemove(function(e){if(mouse=new MouseEvent(e),mouse.x<imageLeft||mouse.x>imageLeft+imageWidth||mouse.y<imageTop||mouse.y>imageTop+imageHeight)return void mouseOutImage();var bigwidth=$(".bigimg").get(0).offsetWidth,bigheight=$(".bigimg").get(0).offsetHeight,scaley="x",scalex="y";if(isNaN(scalex)|isNaN(scaley)){var scalex=bigwidth/imageWidth,scaley=bigheight/imageHeight;""!=imageRotate&&!isNaN(imageRotate)&&imageRotate>0&&(90==imageRotate||270==imageRotate)&&(scalex=bigwidth/imageHeight,scaley=bigheight/imageWidth),$("div.zoomMask").width(settings.xzoom/scalex),$("div.zoomMask").height(settings.yzoom/scaley),$("div.zoomMask").css("visibility","visible")}xpos=mouse.x-$("div.zoomMask").width()/2,ypos=mouse.y-$("div.zoomMask").height()/2,xposs=mouse.x-$("div.zoomMask").width()/2-imageLeft,yposs=mouse.y-$("div.zoomMask").height()/2-imageTop,xpos=mouse.x-$("div.zoomMask").width()/2<imageLeft?imageLeft:mouse.x+$("div.zoomMask").width()/2>imageWidth+imageLeft?imageWidth+imageLeft-$("div.zoomMask").width():xpos,ypos=mouse.y-$("div.zoomMask").height()/2<imageTop?imageTop:mouse.y+$("div.zoomMask").height()/2>imageHeight+imageTop?imageHeight+imageTop-$("div.zoomMask").height():ypos,$("div.zoomMask").css({top:ypos,left:xpos}),$("div.zoomDiv").get(0).scrollLeft=xposs*scalex,$("div.zoomDiv").get(0).scrollTop=yposs*scaley,""!=imageRotate&&!isNaN(imageRotate)&&imageRotate>0&&($("div.zoomDiv").get(0).style.transform="rotate("+imageRotate+"deg)",console.log("imageLeft="+imageLeft+",imageTop="+imageTop+",imagewidth = "+imageWidth+",imageHeight="+imageHeight+",xposs="+xposs+",yposs="+yposs)),""!=imageRotate&&!isNaN(imageRotate)&&imageRotate>0&&90==imageRotate?(yposs=mouse.y-imageTop-$("div.zoomMask").height()/2,xposs=imageWidth+imageLeft-mouse.x-$("div.zoomMask").width()/2,$("div.zoomDiv").get(0).scrollTop=xposs*scalex,$("div.zoomDiv").get(0).scrollLeft=yposs*scaley):""!=imageRotate&&!isNaN(imageRotate)&&imageRotate>0&&180==imageRotate?(yposs=imageHeight-(mouse.y-imageTop)-$("div.zoomMask").height()/2,xposs=imageWidth+imageLeft-mouse.x-$("div.zoomMask").width()/2,$("div.zoomDiv").get(0).scrollLeft=xposs*scalex,$("div.zoomDiv").get(0).scrollTop=yposs*scaley):""!=imageRotate&&!isNaN(imageRotate)&&imageRotate>0&&270==imageRotate&&(yposs=mouse.x-imageLeft-$("div.zoomMask").width()/2,xposs=imageHeight+imageTop-mouse.y-$("div.zoomMask").height()/2,$("div.zoomDiv").get(0).scrollLeft=xposs*scalex,$("div.zoomDiv").get(0).scrollTop=yposs*scaley)})}),count=0,settings.preload&&($("body").append("<div style='display:none;' class='jqPreload"+count+"'></div>"),$(this).each(function(){var imagetopreload=$(this).attr("rel"),content=jQuery("div.jqPreload"+count).html();jQuery("div.jqPreload"+count).html(content+'<img src="'+imagetopreload+'">')}))}}(jQuery);