网页里控制图片大小的相关代码

１、用鼠标拖动来改变大小

<SCRIPT LANGUAGE="JavaScript">
function resizeImage(evt,obj){
newX=evt.x
newY=evt.y
obj.width=newX
obj.height=newY
}
</script>
<img src="7say.gif" οndrag="resizeImage(event,this)">

２、用鼠标滚动控制图片大小

<img src="7say.gif" οnmοuseenter="focus();" οnmοuseοut="blur();" onmousewheel="width+=(window.event.wheelDelta==120)?-5:+5;">

３、图片标签里用代码控制大小

<img border="0" src="[!--picurl--]" οnlοad="if(this.width>screen.width-500)this.style.width=screen.width-500;">

４、CSS控制图片大小
1. css2直接实现: img{max-width: 500px;} (IE暂不支持)
2. expression实现: img{width:expression(width>500?"500px":width);} (IE only)
3. 使用js. 方法: 用 document.getElementsByTagName("IMG") 的方法取得全部img元素 遍历img元素 判断其宽度并做相应操作

 

5、原图(小图):<br>
i(UiQ-U,],A0<IMG id="img1" src="http://www.google.com/options/icons/picasa.gif" style="border:1px #ff0000 solid" >PHPChina 开源社区门户7xA1l Af3d
<a href=javascrīpt:void(0) ōnClick="alert( document.getElementById('img1').width + '×' + document.getElementById('img1').height ) ">图片大小</a>
!N(j9E4h1}.M5F0<br><hr><br>
b.^ OQA06、小图放大：<br>
gV9K4v5l{(y @0<IMG id="img2" src="http://www.google.com/options/icons/picasa.gif" style="border:1px #ff0000 solid" ōnload="resizeImg(this)">
p4}'f2Mq3N$T@0<a href=javascrīpt:void(0) ōnClick="alert( document.getElementById('img2').width + '×' + document.getElementById('img2').height ) ">图片大小</a>PHPChina 开源社区门户R'? ^{H6Il%j/U
<br><hr><br>PHPChina 开源社区门户w e m;qbIx'MV
7、原图(大图):<br>
*UL/dF6U0<IMG id="img3" src="http://www.google.cn/intl/zh-CN/images/logo_cn.gif" style="border:1px #ff0000 solid" >
:jX0_/fOS,Y�H^/[V6r0<a href=javascrīpt:void(0) ōnClick="alert( document.getElementById('img3').width + '×' + document.getElementById('img3').height ) ">图片大小</a>PHPChina 开源社区门户*P'@*HU5hJ2uu
<br><hr><br>
&x /7]0dw08、大图缩小：<br>
?L'Y$y }yQ;~0<IMG id="img4" src="http://www.google.cn/intl/zh-CN/images/logo_cn.gif" style="border:1px #ff0000 solid" ōnload="resizeImg(this)">PHPChina 开源社区门户4z$u#c#f1T%W E x&_
<a href=javascrīpt:void(0) ōnClick="alert( document.getElementById('img4').width + '×' + document.getElementById('img4').height ) ">图片大小</a>PHPChina 开源社区门户[B&J7ME |0n
<br><hr><br>PHPChina 开源社区门户w*U$g/o1?:]%@

PHPChina 开源社区门户8r$WPEA<scrīpt type="text/javascrīpt">
"d�d%Y.~3z/c#bE o0function resizeImg(obj){
;L^0i@e C^ s(H5j0   if(obj.width>100||obj.height>100){PHPChina 开源社区门户%MCx?? V0z
      for(i=0;(obj.width>=101||obj.height>=101);i++)PHPChina 开源社区门户jX%h#u t/$[
      {
&L(@g)k m;K0         obj.width-=1;PHPChina 开源社区门户1S I:Ud*^6_y
      }PHPChina 开源社区门户r@)dvqic
   }PHPChina 开源社区门户Ge,uJ./*g4NSA.`6|7w
   else if(obj.width<100||obj.height<100){
OT(`j"P8c0      for(i=0;(obj.width<=99&&obj.height<=99);i++){
R:}hHJ~S0         obj.width+=1;PHPChina 开源社区门户4},QDn @DW
      }PHPChina 开源社区门户$Q7{ v#C}X
   }PHPChina 开源社区门户1~/ s{`Td*e(H"x
}PHPChina 开源社区门户5s0F.Lq["o
</scrīpt>