esta es la imagen de como se ve
como ven el cursor esta alejado del div con el efecto de zoom debido a que si lo toca el div queda en la parte superior izquierda.
y este es el codigo:
Código Javascript:
Ver original
function zoom(e){//es una llamada de contextmenu e.preventDefault(); var offset = $('.FinalImage').offset(); console.log(offset.top); if(se('.FinalImage>div')===null){ var div=document.createElement('div'); this.appendChild(div); div.style.background=$('.FinalImage').css('background-image')+' scroll no-repeat 0 0/'+($('.FinalImage').width()*3)+'px transparent'; }else{ //se('.FinalImage').removeEventListener('contextmenu', arguments.callee, false); if(se('.FinalImage>div')!==null) se('.FinalImage').removeChild(se('.FinalImage>div')); } this.addEventListener('mousemove', function(ev){//esta es la funcion que avisa que se ha movido el cursor if(se('.FinalImage>div')!==null){ var x=ev.layerX-70, //eje x y=ev.clientY-10;//eje y console.log(y); se('.FinalImage>div').style.top=(y)+'px'; se('.FinalImage>div').style.left=x+'px'; se('.FinalImage>div').style.backgroundPosition='-'+((x+50)*3)+'px -'+((y+30)*3)+'px'; //esta es la parte donde se va moviendo el background aumentado } },false); }
listos chicos ese seria mi problema en si....
agradezco la ayuda :D