// JScript 文件

function ChangePicture(imgName)
{
    document.getElementById("smallpic").src="./product_img_detail/"+imgName;
//    document.getElementById("linkImage").href="detailimage.aspx?src="+imgName;
       document.getElementById("bigpic").src="./product_img_ori/"+imgName;
       
}

var srcX = 500; //原图大小,可以任意设置
var srcY = 500;
var bigX = 300; //预览窗大小,可以任意设置
var bigY = 300;
var smallX = 282 //缩略图宽度
var smallY = srcY * smallX / srcX;
var viewX = bigX / srcX * smallX; //预览范围
var viewY = bigY / srcY * smallY;
var bl = srcX / smallX;//缩小比例
var border = 1; //边框
window.onload=function (){
//head.innerHTML="图片载入";
document.getElementById("smallpic").width=smallX;
document.getElementById("smallpic").height=smallY;
document.getElementById("bigpic").width=srcX;
document.getElementById("bigpic").height=srcY;
document.getElementById("view").style.width=viewX;
document.getElementById("view").style.height=viewY;
document.getElementById("smallbox").style.borderWidth=border;
document.getElementById("bigbox").style.borderWidth=border;
if (window.event){
document.getElementById("smallbox").style.width=document.getElementById("smallpic").offsetWidth+border*2;
document.getElementById("smallbox").style.height=document.getElementById("smallpic").offsetHeight+border*2;
document.getElementById("bigbox").style.width=bigX+border*2;
document.getElementById("bigbox").style.height=bigY+border*2;
}else{
document.getElementById("smallbox").style.width=document.getElementById("smallpic").offsetWidth;
document.getElementById("smallbox").style.height=document.getElementById("smallpic").offsetHeight;
document.getElementById("bigbox").style.width=bigX;
document.getElementById("bigbox").style.height=bigY;
}
move(event);
}
function move(e){

var e = window.event?window.event:e;
var iebug = 0;
if (window.event){
var vX = e.offsetX - viewX/2;
var vY = e.offsetY - viewY/2;
}else{
var vX = e.pageX - viewX/2 - document.getElementById("smallbox").offsetLeft - border;
var vY = e.pageY - viewY/2 - document.getElementById("smallbox").offsetTop - border;
iebug = 2;
}

if (vX  < 0){vX = 0;}
if (vY  < 0) {vY = 0;}
if (vX > smallX - viewX - iebug) {vX = smallX - viewX - iebug;}
if (vY > smallY - viewY - iebug) {vY = smallY - viewY - iebug;}
document.getElementById("bigpico").style.marginLeft = - vX * bl +"px";
document.getElementById("bigpico").style.marginTop = - vY * bl+"px"; 
document.getElementById("view").style.left = vX +document.getElementById("smallbox").offsetLeft + border+"px";
document.getElementById("view").style.top = vY + document.getElementById("smallbox").offsetTop + border+"px"; 

}

function aa(){

document.getElementById('bigbox').style.display="none";
document.getElementById('view').style.border="none";
}
function bb(){
 document.getElementById('bigbox').style.display="block";
 //document.getElementById('view').style.border="1px solid #FF9900";
 //document.getElementById('view').style.background="#009999";
 //document.getElementById('view').style.filter="alpha(opacity=40)";
}