JavaScript圖片簡單等比例縮放

admin發表於2018-07-16

上傳圖片時候,可能圖片的尺寸是未知的,例如尺寸過大,可能會導致網頁變形或者錯誤。

美觀度就會受到極大影響,所以通常要進行等比例縮放。

程式碼例項如下:

[JavaScript] 純文字檢視 複製程式碼
var resizeImg=function(img, maxWidth, maxHeight){
  var w=img.width;
  var h=img.height;
  //當圖片比預覽區域小時不做任何改變
  if(w < maxWidth && h < maxHeight) return;
  // 當實際圖片比例大於預覽區域寬高比例時
  // 縮放圖片寬度,反之縮放圖片寬度
  w/h>maxWidth/maxHeight?img.width=maxWidth:img.height=maxHeight;
}

上面程式碼的計算方式是一個純數學問題,自行分析即可。

相關文章