{include file="header.html"}
<style>
.w980 { width:880px; margin:0 auto; padding:0; }
.blank4 { height:4px; overflow:hidden; clear:both; }
.blank8 { height:8px; overflow:hidden; clear:both; }
.blank12 { height:12px; overflow:hidden; clear:both; }
.blank16 { height:16px; overflow:hidden; clear:both; }
/*图片展示最终页*/
#imgShow{ width:880px; margin:0 auto;}
#imgShow .dz{ text-align:left; text-indent:1em; border-bottom:2px solid #CCCCCC; height:25px; line-height:25px;}
#imgShow #imgShowA{ }
#imgShow #imgShowA img{ position:relative; top:6px;}
#imgShow #imgShowA a{ color:#666; }
#imgShow #imgShowA .left{ width:480px; float:left; text-align:left;}
#imgShow #imgShowA .right{ width:480px; float:right; text-align:right;}
#imgShow #imgShowB{ overflow:hidden;}
#imgShow #imgShowB .left{ width:680px; float:left; position:relative; }
#imgShow #imgShowB .left .next{ background:url({$template_path}images/imgbtn04.gif); width:57px; height:57px;  position:absolute; right:0px; top:180px;}
#imgShow #imgShowB .left .prev{  background:url({$template_path}images/imgbtn03.gif); width:57px; height:57px;  position:absolute; left:0px; top:180px;}
#imgShow #imgShowB .left .next a{  width:57px; height:57px; display:block;  }
#imgShow #imgShowB .left .prev a{  width:57px; height:57px; display:block;  }
#imgShow #imgShowB .left .img{ width:500px; margin:0 auto; }
#imgShow #imgShowB .left .text{ text-align:center; height:35px; line-height:35px;}
#imgShow #imgShowB .left .intro{ border-top:5px solid #F7F7F7; text-align:left; line-height:25px; padding:10px 15px; color:#666666;}

#imgShow #imgShowB .right{ width:180px; float:right; margin-right:20px; display:inline; }
#imgShow #imgShowB .right .up{ background: url({$template_path}images/imgbtn05.gif); width:180px; height:20px; }
#imgShow #imgShowB .right .down{ background: url({$template_path}images/imgbtn06.gif); width:180px; height:20px;  }
#imgShow #imgShowB .right .up a{ width:180px; height:20px; display:block; }
#imgShow #imgShowB .right .down a{ width:180px; height:20px; display:block; }
#imgShow #imgShowB .right .box{ border-bottom:2px solid #447080; border-top:2px solid #447080;  background:#EEEEEE; height:510px; overflow:hidden; padding:10px 0;  }
#imgShow #imgShowB .right .box img{ margin:8px 0 0 0;}
</style>

<div class="cbox1" style="margin-left:113px">
	<div class="row1"> 
		<ul class="u1">
		{$home.nowNave}
		<li>图库</li>
		</ul>
	</div>
	<div style="float:left;width:150px;padding: 5px;font-weight: bold">缩图列表</div>
</div>		

<div id="imgShow" style="margin-left:120px">

	<div id="imgShowA" style="margin: 0px;"> 
	</div> 
	<div class="blank16"></div> 
	<div id="imgShowB">
		<div class="left">
			<div id="showist"> 
			    <div class="text"><h1>{$home.producttxt.nowproname}</h1></div>
				<div class="img" id="article"><img src="{$home.producttxt.first_img}" alt="" border="0" id="main_img" width="500" /></div>  
			</div>   
		</div>
		<div class="right"> 
			<div class="up"><a id="gotop" href="#"></a></div>
			<div class="box" id="showArea"> 
			<!-- {foreach from=$home.producttxt.img_list item=images_list} --> 
				<a onmouseover=showbigimg("{$images_list.filename}") style="cursor:pointer"><img SRC="{$images_list.thumb_url}"  BORDER="0" title="{$images_list.descs}" style="margin: auto;padding: 0;" width="{$min_thumb_w}" height="{$min_thumb_h}" ></a> 
				<div style="margin:2px">&nbsp;</div>
			<!-- {/foreach} --> 
			</div>  
			<div class="down"><a id="gobottom" href="#"></a></div>
		</div>
	</div>
</div> 
<script type="text/javascript" src="js/pic.js"></script> 
<script language="JavaScript">
  {literal}
	//缩放图片到合适大小
	function ResizeImages()
	{
		var myimg,oldwidth,oldheight;
		var maxwidth=500;
		//var maxheight=480;
		var imgs = document.getElementById('main_img').getElementsByTagName('img');   //如果你定义的id不是article，请修改此处

		for(i=0;i<imgs.length;i++){
		 myimg = imgs[i];

		 if(myimg.width > myimg.height)
		 {
			 if(myimg.width > maxwidth)
			 {
				oldwidth = myimg.width;
				myimg.height = myimg.height * (maxwidth/oldwidth);
				myimg.width = maxwidth;
			 }
		 }else{
			 if(myimg.height > maxheight)
			 {
				oldheight = myimg.height;
				myimg.width = myimg.width * (maxheight/oldheight);
				myimg.height = maxheight;
			 }
		 }
		}
	}
	function showbigimg(bigsrc){
		//var  aa=document.getElementById(id).src;
	 	document.getElementById("main_img").src=bigsrc; 
	}
	//缩放图片到合适大小
	ResizeImages();  
  {/literal}
</script>
{include file="footer.html"}