<%@ Page Language="C#" AutoEventWireup="true" CodeFile="see_pic.aspx.cs" Inherits="see_pic" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Register Src="controls/bottommenu.ascx" TagName="bottommenu" TagPrefix="uc2" %>
<%@ Register Namespace="wormubb" TagPrefix="aa"%>
<%@ Register Src="controls/left.ascx" TagName="left" TagPrefix="uc1" %>

<html>
<head id="Head1" runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>图片浏览</title>
<LINK href="css/default.css" type=text/css rel=stylesheet>
<script>
function window_onunload() 
{

  if (event.clientX < 0 && event.clientY < 0)
  {
  window.open('logout.aspx','leave','');
  }
}
</script>
<style type="text/css">
<!-- 

p#outer {
 	margin:0 auto;
 	width:202px;
 }
#outer a {
	margin:0px; 
	display:block;
	position: relative;
 	border:1px solid #008800;
}
#outer a:hover {border:1px dashed #ff6600;}
#outer img {display:block;border:none;background:#008800;}
-->
</style>

</head>

<body>
	 <form id="all" runat="server">
<TABLE cellSpacing=0 cellPadding=0 width=1002 align=center border=0>
<TBODY>
<TR>
<TD width=1002 colSpan=6><IMG height=38 alt="" src="skin/629000cn_r01/pic_03b.gif" width=1002></TD></TR></TBODY></TABLE>
<table height="573" cellspacing="0" cellpadding="0" width="1002" align="center" border="0">
  <tbody>
    <tr>
      <td width="30" height="573"><img height="573" alt="" src="skin/629000cn_r01/pic_04.gif" width="30" /></td>
      <td valign="top" width="468" background="skin/629000cn_r01/pic_05_private.gif"><table width="100%" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td>
              <uc1:left ID="Left1" runat="server" />
          </td>
        </tr>
      </table>
      </td>
      <td width="7"><img height="573" alt="" src="skin/629000cn_r01/pic_06.gif" width="7" /></td>
      <td valign="top" align="center" width="467" background="skin/629000cn_r01/pic_07_private.gif">      <div class="m73" style="width:400px; height:500px; margin-left:10px; overflow-y:auto;overflow-x:hidden;"  align="left">
      <div class="room layout" id="xwxc">
	  <table width="400" border="0" cellspacing="0" cellpadding="0">
	  <tr>
		  <td>
		    <div align="left" style="padding-left:10px">
                <asp:Label ID="bigtitle" runat="server" Text="日志栏→" Font-Bold="True" Font-Size="Larger" ForeColor="#51300C"></asp:Label>
                <asp:Label ID="lbclass" runat="server" Font-Bold="True" Font-Size="Larger" ForeColor="#51300C"
                    Text="Label"></asp:Label></div>
					<hr style="height:1px; width:400px" align="left"/></td>
		</tr>
	   <asp:DataList ID="DataList1" runat="server" DataKeyField="ID">
         <itemtemplate>
         
           <tr>
             <td  height="460" valign="top"><img src="showimg/01.jpg" width="121" height="96" _fcksavedurl="showimg/01.jpg"/></td>
             <td><img src="showimg/01.jpg" width="121" height="96" _fcksavedurl="showimg/01.jpg"/></td>
             <td><img src="showimg/01.jpg" width="121" height="96" _fcksavedurl="showimg/01.jpg"/></td>
           </tr>
         
		 </itemtemplate>
	   </asp:DataList>
	   <tr>
          <td><table cellpadding="0" cellspacing="0" class="m73" style="margin-left: 70px">
            <tr>
              <td style="padding-top: 8px"> 当前
                <asp:Label ID="curpage" runat="server" Text="1"></asp:Label>
                /
                <asp:Label ID="allpage" runat="server" Text="Label"></asp:Label>
                页
                <asp:LinkButton ID="first" runat="server" OnClick="first_Click">首页</asp:LinkButton>
                <asp:LinkButton ID="pre" runat="server" OnClick="pre_Click">上一页</asp:LinkButton>
                <asp:LinkButton ID="next" runat="server" OnClick="next_Click">下一页</asp:LinkButton>
                <asp:LinkButton ID="last" runat="server" OnClick="last_Click">尾页</asp:LinkButton>
                &nbsp; 转到: </td>
              <td><asp:DropDownList ID="pagelist" runat="server" AutoPostBack="True" BackColor="White"
                        Font-Size="XX-Small" ForeColor="#736f57" Height="8px" OnSelectedIndexChanged="downchange"> </asp:DropDownList>              </td>
            </tr>
          </table></td>
        </tr>
	   </table>
      </div>


     <script type="text/javascript">
		function ImgShow(evt){
			var imgTag=(window.event)?event.srcElement:evt.target;
			var imgPath=imgTag.src.replace("a.jpg",".jpg");//取得弹出的大图url
			var tagTop=Math.max(document.documentElement.scrollTop,document.body.scrollTop);
			var tag=document.createElement("div");
				tag.style.cssText="width:100%;height:"+Math.max(document.body.clientHeight,document.body.offsetHeight)+"px;position:absolute;background:white;top:0;filter: Alpha(Opacity=80);Opacity:0.8;";
				tag.ondblclick=function(){var clsOK=confirm("确定要取消图片显示吗?"); if(clsOK){closes();}};
			var tagImg=document.createElement("div");
				tagImg.style.cssText="font:12px /18px verdana;overflow:auto;text-align:center;position:absolute;width:200px;border:5px solid gray;background:gray;color:white;left:"+(parseInt(document.body.offsetWidth)/2-100)+"px;top:"+(document.documentElement.clientHeight/3+tagTop)+"px;"
				tagImg.innerHTML="<div style='padding:10px;background:#cccccc;border:1px solid white'><img src='images/wait2.gif'/><br /><br /><b style='color:#999999;font-weight:normal'>Image loading...</b><br /></div>";
			var closeTag=document.createElement("div");
				closeTag.style.cssText="display:none;position:absolute;left:10px;top:10px;background:red;border:1px solid white;yellow:white;filter:Alpha(Opacity=50);Opacity:0.5;cursor:pointer;";
				closeTag.innerHTML="<b> 关闭 </b>";
				closeTag.onclick=closes;
			document.body.appendChild(tag);
			document.body.appendChild(tagImg);
			var img=new Image();
				img.src=imgPath;
				img.style.cssText="border:1px solid #cccccc;filter: Alpha(Opacity=0);Opacity:0;";
				tagImg.oncontextmenu=function(){var clsOK=confirm("确定要取消图片显示吗?"); if(clsOK){closes();};return false};
			var barShow,imgTime;
			img.complete?ImgOK():img.onload=ImgOK;
			function ImgOK(){
				var Stop1=false,Stop2=false,temp=0;
				var tx=tagImg.offsetWidth,ty=tagImg.offsetHeight;
				var ix=img.width,iy=img.height;
				var sx=document.documentElement.clientWidth,sy=Math.min(document.documentElement.clientHeight,document.body.clientHeight/*opera*/);
				var xx=ix>sx?sx-50:ix+4,yy=iy>sy?sy-50:iy+3;
				var maxTime=setInterval(function(){
					temp+=35;
					if((tx+temp)<xx){
						tagImg.style.width=(tx+temp)+"px";
						tagImg.style.left=(sx-(tx+temp))/2+"px";
					}else{
						Stop1=true;
						tagImg.style.width=xx+"px";
						tagImg.style.left=(sx-xx)/2+"px";
					}
					if((ty+temp)<yy){
						tagImg.style.height=(ty+temp)+"px";
						tagImg.style.top=(tagTop+((sy-(ty+temp))/2))+"px";
					}else{
						Stop2=true;
						tagImg.style.height=yy+"px";
						tagImg.style.top=(tagTop+((sy-yy)/2))+"px";
					}
					if(Stop1&&Stop2){
						clearInterval(maxTime);
						tagImg.appendChild(img);
						temp=0;
						imgOPacity();
					}
				},1);
				function imgOPacity(){
					temp+=10;
					img.style.filter="alpha(opacity="+temp+")";
					img.style.opacity=temp/100;
					imgTime=setTimeout(imgOPacity,1)
					if(temp>100) clearTimeout(imgTime);
				}
				tagImg.innerHTML="";
				tagImg.appendChild(closeTag);
				if(ix>xx||iy>yy){
					img.alt="左键拖动,双击放大缩小";
					img.ondblclick=function (){
						if(tagImg.offsetWidth<img.offsetWidth||tagImg.offsetHeight<img.offsetHeight){
							img.style.width="auto";
							img.style.height="100%";
							img.alt="双击可以放大";
							img.onmousedown=null;
							closeTag.style.top="10px";
							closeTag.style.left="10px";
							tagImg.style.overflow="visible";
							tagImg.style.width=img.offsetWidth+"px";
							tagImg.style.left=((sx-img.offsetWidth)/2)+"px";
						}else{
							img.style.width=ix+"px";
							img.style.height=iy+"px";
							img.alt="双击可以缩小";
							img.onmousedown=dragDown;
							tagImg.style.overflow="auto";
							tagImg.style.width=xx+"px";
							tagImg.style.left=((sx-xx)/2)+"px";
						}
					}
					img.onmousedown=dragDown;
					tagImg.onmousemove=barHidden;
					tagImg.onmouseout=moveStop;
					document.onmouseup=moveStop;
				}else{
					tagImg.style.overflow="visible";
					tagImg.onmousemove=barHidden;
				}
			}
			function dragDown(a){
				img.style.cursor="pointer";
				var evts=a||window.event;
				var onx=evts.clientX,ony=evts.clientY;
				var sox=tagImg.scrollLeft,soy=tagImg.scrollTop;
				var sow=img.width+2-tagImg.clientWidth,soh=img.height+2-tagImg.clientHeight;
				var xxleft,yytop;
				document.onmousemove=function(e){
					var evt=e||window.event;
					xxleft=sox-(evt.clientX-onx)<0?"0":sox-(evt.clientX-onx)>sow?sow:sox-(evt.clientX-onx);
					yytop=soy-(evt.clientY-ony)<0?"0":soy-(evt.clientY-ony)>soh?soh:soy-(evt.clientY-ony);
					tagImg.scrollTop=yytop;
					tagImg.scrollLeft=xxleft;
					closeTag.style.top=(yytop+10)+"px";
					closeTag.style.left=(xxleft+10)+"px";
					return false;
				}
				return false;
			}
			function barHidden(){
				clearTimeout(barShow);
				if(closeTag.style.display=="none")closeTag.style.display="block";
				barShow=setTimeout(function(){closeTag.style.display="none";},2000);
			}
			function closes(){
				document.body.removeChild(tag);
				document.body.removeChild(tagImg);
				clearTimeout(barShow);
				clearTimeout(imgTime);
				document.onmouseup=null;
				tag=img=tagImg=closeTag=null;
			}
			function moveStop(){
				document.onmousemove=null;
				tagImg.onmousemove=barHidden;
				img.style.cursor="default";
			}
		}
	</script>
    <script type="text/javascript">//实例化
		var imgList1=document.getElementById("xwxc").getElementsByTagName("img");
		//var imgList3=document.getElementById("wenchuan").getElementsByTagName("img");
		for(var i in imgList1){
			imgList1[i].onclick=ImgShow;
		}
		//for(var i in imgList3){
		//	imgList3[i].onclick=ImgShow;
		//}
	</script>
	  </div>
      <table class="m73" cellspacing="0" cellpadding="0" width="100%" border="0">
            <tbody>
              <tr>
                <td valign="top" align="center" height="45" style="padding-top:10px">
                    <uc2:bottommenu ID="Bottommenu1" runat="server" />
                </td>
              </tr>
            </tbody>
      </table></td>
      <td width="30"><img height="573" alt="" src="skin/629000cn_r01/pic_08.gif" width="30" /></td>
    </tr>
  </tbody>
</table>
<TABLE cellSpacing=0 cellPadding=0 width=1002 align=center border=0>
<TBODY>
<TR>
<TD width=457 colSpan=6 height=35><IMG height=35 alt="" src="skin/629000cn_r01/pic_09.gif" width=1002></TD></TR></TBODY></TABLE>
     </form>
</body>
</html>
