IEの画像onLoad問題

Question

IEでは、巨大な画像を縮小しません。実際、それはすべてではなく一部のものを拡大します。小さな幅と高さの属性を設定することによって、それらを縮小します。それを修正するには？そのような

var $image = $('<img/>'); 
$image.attr('src', 'http://example.com/img.jpeg'); 
$image.load(function() { 
    this.width = this.height = 100; 
}); 

何かを次のように

私はそれを行います。しかし、すべての画像が縮小されるわけではありません。そして、ページをリロードするたびに、さまざまなイメージが縮小されます。

私はこの問題が何かを知りました。 Jeremy Wadhamsが書いたimg onload doesn't work well in IE7

を参照してください。

Answer 1

html要素で幅と高さを定義すると、これはうまくいくはずです。 CSSでは、IE6は標準に準拠しておらず、結果は異なる場合があります。

ベストプラクティスでは、ブラウザで画像のサイズを変更しないでください。すべての処理が遅くなり、ピクセル化が発生します。適切なサイズの画像をコピーして、フルサイズの画像にリンクします。

これを済ませたら、それらの画像を私の目の前に置いてください。

Answer 2

ブラウザに画像を縮小してはいけません。パフォーマンス上の理由から、これはあなたのユーザーのためにあなたのサイトを駄目にするでしょう。ユーザーのブラウザが「巨大な」画像を縮小するように強制すると、最初に画像を完全にダウンロードしてからブラウザで拡大縮小する必要があり、ワークフローが遅くなります。また、正しいサイズの画像を使用するよりも帯域幅が大きくなります。

イメージは、ユーザーに表示するサイズで提供する必要があります。複数のサイズが必要な場合は、サーバー上に複数のサイズのイメージを置くことができます。ハードドライブのスペースは、帯域幅（あなたとあなたのユーザーの両方）よりも安いです。