Skip to content

Instantly share code, notes, and snippets.

@JafarAkhondali
Created August 19, 2016 08:31
Show Gist options
  • Save JafarAkhondali/4130def89f762f34387607cffe36fbdd to your computer and use it in GitHub Desktop.
Save JafarAkhondali/4130def89f762f34387607cffe36fbdd to your computer and use it in GitHub Desktop.
$.fn.lightzoom=function(options){var settings=$.extend({zoomPower:3,glassSize:175,},options);var halfSize=settings.glassSize/2;var quarterSize=settings.glassSize/4;var zoomPower=settings.zoomPower;$("body").append('<div id="glass"></div>');$("html > head").append($("<style> #glass{width: "+settings.glassSize+"px; height: "+settings.glassSize+"px;}</style>"));var faker;var obj=this;$("#glass").mousemove(function(event){var obj=this.targ;event.target=obj;faker(event,obj);});this.mousemove(function(event){faker(event,this);});faker=function(event,obj){document.getElementById("glass").targ=obj;var mx=event.pageX;var my=event.pageY;var w=obj.offsetWidth;var h=obj.offsetHeight;var ol=obj.offsetLeft;var ot=obj.offsetTop;if(mx>ol&&mx<ol+w&&ot<my&&ot+h>my){offsetXfixer=((mx-ol-w/2)/(w/2))*quarterSize;offsetYfixer=((my-ot-h/2)/(h/2))*quarterSize;var cx=(((mx-ol+offsetXfixer)/w))*100;var cy=(((my-ot+offsetYfixer)/h))*100;my-=halfSize;mx-=halfSize;$("#glass").css({top:(my),left:(mx),"background-image":" url('"+obj.src+"')","background-size":(w*zoomPower)+"px "+(h*zoomPower)+"px","background-position":cx+"% "+cy+"%",display:"inline-block"});$("body").css("cursor","none");}else{$("#glass").css("display","none");$("body").css("cursor","default");}};return this;};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment