本文介绍了使用JavaScript获取图片原始宽高的方法，以及实现图片等比缩放的完整代码。通过Image对象预加载获取真实尺寸，并根据设定宽高限制计算新比例，确保图片不变形。
JavaScript获取图片大小及等比缩放实现
本文通过具体实例，讲解如何利用JavaScript获取图片的实际大小，并实现图片的等比缩放功能。内容旨在为读者提供实用的代码参考。
首先介绍如何获取图片的原始尺寸信息。
var originImage = new Image();
function GetImageWidth(oImage) {
if (originImage.src != oImage.src) originImage.src = oImage.src;
return originImage.width;
}
function GetImageHeight(oImage) {
if (originImage.src != oImage.src) originImage.src = oImage.src;
return originImage.height;
}
接着演示图片等比缩放的逻辑与实现方式。
function SetImage(ImgD, FitWidth, FitHeight) {
var image = new Image();
image.src = ImgD.src;
if (image.width > 0 && image.height > 0) {
if (image.width / image.height >= FitWidth / FitHeight) {
if (image.width > FitWidth) {
ImgD.width = FitWidth;
ImgD.height = (image.height * FitWidth) / image.width;
} else {
ImgD.width = image.width;
ImgD.height = image.height;
}
} else {
if (image.height > FitHeight) {
ImgD.height = FitHeight;
ImgD.width = (image.width * FitHeight) / image.height;
} else {
ImgD.width = image.width;
ImgD.height = image.height;
}
}
}
}
如需了解更多JavaScript相关知识，可参考本站专题：《JavaScript切换特效与技巧总结》、《JavaScript图形绘制技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》。
希望上述关于JavaScript程序设计的分享能对读者有所帮助。