HTML: <script language="JavaScript" type="text/JavaScript"> //改变图片大小 function resizepic(thispic) { if(thispic.width>700) thispic.width=700; } </script> 数字就是要限制的宽度
也就是说需要一个行为来调用 resizepic() 函数,诸如点击按钮、页面加载等等。 cc1234 的代码理论上不错,但是对文档中所有的图像都起作用了,这样就不行了。 如果是诸如论坛帖子中的图片,我们可以将其加上一个 class 属性,这样针对具有指定的 class 属性的图片改变大小。 例如 class="postImg" PHP: <script language="javascript" type="text/javascript"> //改变图片大小 function resizepic() { for (var i=0; i<document.images.length; i++) { if (document.images[i].className == "postImg" && document.images[i].width > 350) { document.images[i].width = 350; } } } </script> 在 <body> 中通过 onload 加载: HTML: <body onload="resizepic();">
在另外一篇帖子中,有人已经收集了相关代码: .经常看到一些图片很大,上传后显示会撑满屏幕下面的例子通过检测if(this.width>screen.width-350)then(this.width=screen.width-350)如果该图片的宽度大于“屏幕宽度-350”,则让该图就显示“屏幕宽度-350”这么大小。 原图 HTML: <img src="jsimg/wallpaper.jpg"> 设定大小的图 HTML: <img src="jsimg/wallpaper.jpg" onload="javascript:if(this.width>screen.width-350) this.width=screen.width-350">
例如宽度比560大的自动变为560,应该不能再简单了吧 PHP: <script language="JavaScript" type="text/JavaScript"> //改变图片大小 function resizepic(thispic) { if(thispic.width>560) thispic.width=560; } </script> 图片后加入:onload=javascript:resizepic(this) PHP: <IMG src="/test.jpg" onload=javascript:resizepic(this) >