控制TD中图片的大小

<body>   
  <table><tr><td   id="otd"><div></div><img/><img/><hr/><img/></td></tr></table>   
  <script   language="JavaScript"   type="text/javascript">   
  function   set()   
  {   
  var   o   =   document.getElementById("otd");   
  var   cns   =   o.childNodes;   
  for(var   i=0;i<cns.length;i++)   
    {   
  var   __temp   =   cns[i];   
 if(__temp.tagName!=null){
  if(__temp.tagName.toLowerCase()   ==   "img")   
  {   
  __temp.width   =   40;   
  __temp.height   =   40;   
  }   
  }  
} 
  }   
  set();   
  </script>   
  </body>

 

<!DOCTYPE   html   PUBLIC   "-//W3C//DTD   XHTML   1.0   Transitional//EN"   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
  <html   xmlns="http://www.w3.org/1999/xhtml">   
  <!--   DW6   -->   
  <head>   
  <meta   http-equiv="Content-Type"   content="text/html;   charset=utf-8"   />   
  <title>shawl.qiu   template</title>   
  <style   type="text/css">   
  /*   <![CDATA[   */   
    
  /*   ]]>   */   
  </style>   
  <script   type="text/javascript">   
  //<![CDATA[   
  window.οnlοad=function(){   
  fResizeImg(400,   300,   'table');   
  //fResizeImg(500,   500);   
  }   
  /*------------------------------------------------------*\   
    *   Subject:   使用   javascript   函数   完美控制页面图片显示大小   By   shawl.qiu       
    *   使用:   
    *   --------------------------------------   
    *   1.   Javascript   脚本块   
    *	window.οnlοad=function(){   
    *	 fResizeImg(500,   500,   'img');   
    *	 //fResizeImg(500,   500);   
    *	}   
    *   
    *   2.   html   body   标签   
    *   <body   οnlοad="fResizeImg(500,   500,   'textMain');"   >   
    *   --------------------------------------   
    *   注:   必须在页面加载完毕后使用本函数(这是基本的客户端应用概念)   
  \*-------------------------------------------------------*/   
  //---------------------------------begin   function   fResizeImg();   
  function   fResizeImg(w,   h,   id){   
  var   img='';   
  var   obj;   
  if(id==undefined)obj=document.images;   
  else   obj=document.getElementById(id).getElementsByTagName('img');   
    
  for(var   i=0;   i<obj.length;   i++){   
  img=obj[i];   
  if(img.width>w&&(img.height<img.width)){   
  img.height=img.height-(img.height/(img.width/(img.width-w)))   
  img.width=w;   
  }else   if(img.height>h&&(img.height>img.width)){   
  img.width=img.width-(img.width/(img.height/(img.height-h)))   
  img.height=h;   
  }   
    
  img.οnclick=function(){   
  try{   imgPopup.close();}   catch(e){}   
  imgPopup=open('#',   'imgurl',   'width=500,   height=500,   left='+(screen.availWidth-500)/2+   
  ',   top='+(screen.availHeight-500)/2)   
  imgPopup.document.write('<script>document.οnclick=function(){   close();}   /*   单击关闭窗口   */   <\/script>');   
    
  imgPopup.document.write('<img   src="'+this.src+'"/>'+   
  '<script>'+   
  'var   w,   h;'+   
  'var   img=document.images[0];'+   
  'if(navigator.appName=="Opera"){w=img.width+10;   h=img.height+40}   else   {w=img.width+10;   h=img.height+25};'+   
  'self.resizeTo(w,   h);'+   
  'self.moveTo((screen.availWidth-img.width)/2,(screen.availHeight-img.height)/2)'+   
  '<\/script>'+   
  '<style>body{margin:0;   padding:0;}   .hd{visibility:hidden;}<\/style>');   
  imgPopup.document.write('<p   class="hd">ok</p>');   
  imgPopup.document.close();   
  imgPopup.focus();   
  }   
  }   //   shawl.qiu   script   
  }   
  //---------------------------------end   function   fResizeImg();   
  //]]>   
  </script>   
  </head>   
  <body>   
  <table   width="100%"     border="1"   id="table">   
      <tr>   
          <td><img   src="temp/2006-10-15/01.jpg"   width="400"   height="381"   /></td>   
          <td><img   src="mod/system/themes/default/default/images/gi_logo_88_31.png"   width="88"   height="31"   /><img   src="images/04.jpg"   width="640"   height="467"   /></td>   
          <td><img   src="mod/system/themes/default/default/images/gi_logo_88_31.png"   width="88"   height="31"   /></td>   
      </tr>   
      <tr>   
          <td><img   src="mod/managemain/themes/default/default/images/gi_logo_300_92.png"   width="300"   height="92"   /></td>   
          <td><img   src="images/03_1.jpg"   width="832"   height="1126"   /></td>   
          <td><img   src="images/gi_logo_300_92.png"   width="300"   height="92"   /></td>   
      </tr>   
      <tr>   
          <td>&nbsp;</td>   
          <td>&nbsp;</td>   
          <td>&nbsp;</td>   
      </tr>   
  </table>   
  </body>   
  </html>  

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值