JavaScript 实现图片自动缩放至指定尺寸
作者:拾光时间:2026-10-23 17:33:06浏览:667
本文介绍如何使用JavaScript在页面加载时动态调整图片尺寸。当图片原始宽高超过100像素时,自动将其限制为100x100,否则保持原图大小。该方法通过img标签的onload事件调用resizeImage函数实现,经测试在IE6、Firefox及Chrome浏览器中均可正常工作。
JavaScript 实现图片自动缩放至指定尺寸
近期项目开发中遇到图片显示需求:当图片原始尺寸大于100x100像素时,需将其缩小至100x100;若图片本身小于该尺寸,则保持原始大小不变。经研究,可通过简单的JavaScript代码实现此功能。
具体JavaScript实现代码如下:
代码示例如下:
<script>
function resizeImage(obj){if(obj.height>100)obj.height=100;if(obj.width>100)obj.width=100; }
</script>页面HTML调用方式如下:
代码示例如下:
﹤img src="file:///E|/Pictures/22.jpg" width="385" height="350" onload="resizeImage(this)"﹥经测试,该方案在IE6、Firefox以及Google Chrome浏览器中均能正常运行。
作者最新文章
JS处理含Emoji或中文的字符串转数组乱码问题
2026-11-05 16:12:28
JS怎么使用展开运算符合并对象
2026-11-05 14:42:18
ES6+环境下判断JS对象为空的简洁写法
2026-11-05 12:12:23
怎么通过replacer函数自定义JS中JSON的格式化输出
2026-11-05 11:19:44
JS正则表达式基础:字面量与RegExp构造函数的区别及常用元字符
2026-11-05 11:16:58
