//放大镜的面向对象,使用的时候需要获取放大镜的两个盒子,和滤镜还有放大后的图片对象;
//最后用的时候要new 出mirror,然后传参进去;先获取:
// var leftBox = $("#leftBox");//获取小图的盒子
// var rightBox = $("#rightBox");//获取大图的盒子
// var drag = $("#drag");//获取滤镜
// var bigImg = $(".bigImg")[0];//获取大图大图和小图的比例是小图和滤镜的比例 //
//var newMirror = new mirror($(".smallBox")[0],$(".bigBox")[0],$(".drag")[0],$(".bigImg")[0])
function mirror(leftBox,rightBox,drag,bigImg){
this.leftBox = leftBox;
this.rightBox = rightBox;
this.drag = drag;
this.bigImg = bigImg;
this.count();
this.move();
}
mirror.prototype.count = function(){
this.leftBoxWid = this.leftBox.offsetWidth;
this.leftBoxHei = this.leftBox.offsetHeight;
this.leftBoxLeft = this.leftBox.offsetLeft;
this.leftBoxTop = this.leftBox.offsetTop;
this.dragWid = parseInt(oGet.getStyle(this.drag,"width"));
this.dragHei = parseInt(oGet.getStyle(this.drag,"height"));
this.maxWid = this.leftBoxWid - this.dragWid;
this.maxHei = this.leftBoxHei - this.dragHei;
}
mirror.prototype.move = function(){
var that = this;
this.leftBox.onmouseover = function(){
that.drag.style.display = "block";
that.rightBox.style.display = "block";
}
this.leftBox.onmouseout = function(){
that.drag.style.display = "";
that.rightBox.style.display = "";
}
document.onmousemove = function(e){
var e = e||window.event;
var scrollT = document.documentElement.scrollTop||document.body.scrollTop;
var disX = e.clientX - that.leftBoxLeft - that.dragWid/2;
var disY = e.clientY - that.leftBoxTop - that.dragHei/2 + scrollT;
if(disX<=0){
disX = 0;
}else if(disX>=that.maxWid){
disX = that.maxWid;
}
if(disY<=0){
disY = 0;
}else if(disY>=that.maxHei){
disY = that.maxHei;
}
that.drag.style.left = disX + "px";
that.drag.style.top = disY + "px";
that.bigImg.style.left = -2*disX + "px";
that.bigImg.style.top = -2*disY + "px";
}
}