レスキューイメージjqueryリサイズで最大サイズをネイティブイメージサイズに設定

Question

Forewarning：私は大変な初心者です。

私はブラウザウィンドウの大きさに基づいて自分のサイトでイメージのサイズを変更するためにこのコードを使用しています。問題は、画像が拡大されてネイティブサイズになり、醜い& pixely画像が作成されることです。次のような疑問がありました：

画像が元のアップロードサイズを超えて拡大するのを防ぐコードが追加されています。

ご協力いただければ幸いです。ここで

は、私が現在持っているものです。

(function($) { 

$.fn.aeImageResize = function(params) { 

var aspectRatio = 0 
// Nasty I know but it's done only once, so not too bad I guess 
// Alternate suggestions welcome :) 
, isIE6 = $.browser.msie && (6 == ~~ $.browser.version) 
; 

// We cannot do much unless we have one of these 
if (!params.height && !params.width) { 
return this; 
} 

// Calculate aspect ratio now, if possible 
if (params.height && params.width) { 
aspectRatio = params.width/params.height; 
} 

// Attach handler to load 
// Handler is executed just once per element 
// Load event required for Webkit browsers 
return this.one("load", function() { 

// Remove all attributes and CSS rules 
this.removeAttribute("height"); 

this.style.height = ""; 

var imgHeight = this.height 
, imgWidth = this.width 
, imgAspectRatio = imgWidth/imgHeight 
, bxHeight = params.height 
, bxWidth = params.width 
, bxAspectRatio = aspectRatio; 

// Work the magic! 
// If one parameter is missing, we just force calculate it 
if (!bxAspectRatio) { 
if (bxHeight) { 
bxAspectRatio = imgAspectRatio + 1; 
} else { 
bxAspectRatio = imgAspectRatio - 1; 
} 
} 

// Only resize the images that need resizing 


if (imgAspectRatio > bxAspectRatio) { 
bxHeight = ~~ (imgHeight/imgWidth * bxWidth); 
} else { 
bxWidth = ~~ (imgWidth/imgHeight * bxHeight); 
} 

this.height = bxHeight-100; 

}) 
.each(function() { 

// Trigger load event (for Gecko and MSIE) 
if (this.complete || isIE6) { 
$(this).trigger("load"); 
} 
}); 
}; 
})(jQuery); 

Answer 1

は、関数の先頭でこれを試してみてください。

if (params.height < this.height || 
    params.width < this.width) 
{ 
    return this; 
}