如何使用 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中文網其他相關文章！