// JavaScript Document//////////////////////////////////////////////////////////////////////////////////////////////////////////
//var div=document.createElement('div'); 
var div=document.getElementById('bigPic');
var showFlag=0;   
function closePanel(){
    div.style.display='none'; 
	showFlag=0;
}
function showPanelAgain(){
	div.style.display=''; 
}
function showPanel(e,src){	
	//if((div.style.display=="none" || showFlag==0)&&document.readyState=="complete"){
	if((div.style.display=="none" || showFlag==0)){
    	div.style.position='absolute';   
    	div.style.display='';  
		src=src.replace("small_images","big_images");
		bodyStr="<div id='big_Pic' style='display:none;'><img id='panelImg' width='450' src='"+src+"'></div>";
		
		//alert(e.offsetTop);
    	var t=e.offsetTop;
    	var l=e.offsetLeft;
		while(e=e.offsetParent){ 
			t+=e.offsetTop;
			l+=e.offsetLeft;
		}		
			
		var left=l;
		var right=document.body.clientWidth-125-left;
		//alert(document.body.clientWidth);
		if(left<=right){//显示在右下方
			l=l+125;
			var bs=getBrowseVersion();
			if(bs=="FireFox"){
				div.style.left=l+"px";
    			div.style.top=t+"px";
			}
			//else if(bs=="IE:8.0"){
			//	div.style.left=(l-46)+"px";
    		//	div.style.top=(t+23)+"px";
			//}
			else 
			{
				div.style.left=l;
    			div.style.top=t;
			}
    		div.innerHTML=getDivBodyR(bodyStr);
		}
		else if(left>right){//显示在左下方
			l=l-472;
			var bs=getBrowseVersion();
			if(bs=="FireFox"){
				div.style.left=l+"px";
    			div.style.top=t+"px";
			}
			//else if(bs=="IE:8.0"){
			//	div.style.left=(l-46)+"px";
    		//	div.style.top=(t+23)+"px";
			//}
			else 
			{
				div.style.left=l;
    			div.style.top=t;
			}
    		div.innerHTML=getDivBodyL(bodyStr);
		}	
    	
    	document.body.appendChild(div);   
		showFlag=1;
		
		Timeer=window.setInterval("showLoading()",500);
	}
	//}
}

function showLoading(){
	var img=document.getElementById("panelImg");
	if(img.complete==true){
		document.getElementById("loadFlag").style.display="none";
		document.getElementById("big_Pic").style.display="";	
		window.clearInterval(Timeer);
	}

}
function getDivBodyR(bodyStr){
	var str="";
	str+="<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\" onMouseOver='showPanelAgain();' onMouseOut='closePanel();'>\n";
	str+="<tr>\n";
	str+="<td width=\"14\" height=\"10\" align=\"left\"><img src=\"images/panel_01.gif\" width=\"14\" height=\"10\"></td>\n";
	str+="<td background='images/panel_02.gif'><img src='images/panel_02.gif' width='20' height='10'></td>\n";
	str+="<td width='9'><img src='images/panel_03.gif' width='9' height='10'></td>\n";
	str+="</tr><tr>\n";
	str+="<td align='left' valign='top' background='images/panel_07.gif'><img src='images/panel_04.gif' width='14' height='26'></td>";
	str+="<td width='100' height='50' bgcolor='#FFFFFF' align='left' valign='top'><div id='loadFlag'><p align='center' style='font-size:18px; color:red; font-weight:bold;'><img src='images/loading3.gif' width='70px'><br>Loading......</p></div>"+bodyStr+"</td>";
	str+="<td background='images/panel_09.gif'>&nbsp;</td>";
	str+="</tr><tr>\n";
	str+="<td height='7'><img src='images/panel_10.gif' width='14' height='7'></td>";
	str+="<td height='7' background='images/panel_11.gif'><img src='images/panel_11.gif' width='10' height='7'></td>";
	str+="<td height='7'><img src='images/panel_12.gif' width='9' height='7'></td>";
	str+="</tr></table>\n";
	return str;
}
function getDivBodyL(bodyStr){
	var str2="";
	str2+="<table border='0' cellpadding='0' cellspacing='0' onMouseOver='showPanelAgain();' onMouseOut='closePanel();'><tr>\n";
  	str2+="<td width='9' height='9'><img src='images/panel3_01.gif' width='9' height='9'></td>\n";
	str2+="<td background='images/panel3_02.gif'></td>\n";
	str2+="<td width='11' height='9'><img src='images/panel3_03.gif' width='11' height='9'></td></tr><tr>\n";
    str2+="<td background='images/panel3_07.gif'>&nbsp;</td>\n";
    str2+="<td width='453' bgcolor='#FFFFFF' height='50' align='left' valign='top'><div id='loadFlag'><p align='center' style='font-size:18px; color:red; font-weight:bold;'><img src='images/loading3.gif' width='70px'><br>Loading......</p></div>"+bodyStr+"</td>";
    str2+="<td valign='top' background='images/panel3_09.gif'><img src='images/panel3_06.gif' width='11' height='19'></td></tr><tr>\n";
    str2+="<td width='9' height='8'><img src='images/panel3_10.gif' width='9' height='8'></td>\n";
    str2+="<td background='images/panel3_11.gif'></td>\n";
    str2+="<td><img src='images/panel3_12.gif' width='11' height='8'></td></tr></table>\n";	
	return str2;
}
