サムネイルの生成タスクをプログラムに任せると、効果が大幅に向上することはわかっていますが、サーバーが GD をサポートしていないなどの特定の要因により、CSS にサムネイルの生成を依頼することが避けられない場合があります。
最新のブラウザの場合、大きな画像を特定のサイズに縮小するには、CSS の max-width プロパティと max-height プロパティを使用するだけです。
IE 6.0 以前の場合、上記の 2 つの CSS プロパティは無視されます。以前は、この種のことに対処するために、JavaScript を使用して画像に onload イベントを追加することがよくありました。例えば：
<imgsrc="..."alt="..."onload="resizeImage(this)"/>
<scripttype="text/javascript">
functionresizeImage(obj){
obj.width=obj.width>50&&obj.width>obj.height?50:auto;
obj.height=obj.height>50?50:auto;
}
</script>
これで問題は確かに解決できますが、将来のページをアップグレードするときに問題が発生します。ブラウザーの CSS サポートが向上するにつれて、遅かれ早かれすべての onload イベントが画像から削除されるでしょう。 It's Expression's Show Time IE は Expression を使用して CSS にいくつかのスクリプトを配置することをサポートしており、このスクリプトは IE 6.0 以前でのみ使用できるため、Expression に書き込むのに最適です。
最後に、大きな画像を 50px*50px 以内に縮小するには、次の CSS を参照できます。
.thumbImage{
最大幅:50ピクセル;
最大高さ:50ピクセル;
}
*html.thumbImage{
width:expression(this.width>50&&this.width>this.height?50:auto);
高さ:式(this.height>50?50:auto);
}
