如何使用 jQuery 按比例调整图像大小：保持纵横比？

使用 jQuery 按比例调整图像大小：保留纵横比

处理大图像时，jQuery 的调整大小功能会派上用场。要在缩放时保持图像比例，请使用以下方法：

逻辑：

此处使用的calculateAspectRatioFit函数根据所需的最大宽度和计算图像的新尺寸

实现：

<code class="js">function calculateAspectRatioFit(srcWidth, srcHeight, maxWidth, maxHeight) {
  var ratio = Math.min(maxWidth / srcWidth, maxHeight / srcHeight);
  return { width: srcWidth*ratio, height: srcHeight*ratio };
}</code>

使用示例：

<code class="js">// Calculate and apply new dimensions to the image
var newDimensions = calculateAspectRatioFit(originalWidth, originalHeight, maxWidth, maxHeight);
$(imageSelector).width(newDimensions.width).height(newDimensions.height);</code>

通过使用这种方法，图像可以按比例缩放，同时保持其原始形状和比例。

以上是如何使用 jQuery 按比例调整图像大小：保持纵横比？的详细内容。更多信息请关注PHP中文网其他相关文章！