High quality CSS thumbnails in IE7

IE7 supports a custom bicubic resampling mode for images. Before, resizing a 500×500 image like this:

<img src="pic.jpg" alt="This image is really 500x500 big" class="thumb" width="50" height="50" />

would produce a horrible result in IE, with noticeably lower quality in the resized version.

This is easily fixed in IE7 by applying the following property to the img tag:

img.thumb { -ms-interpolation-mode: bicubic; }

Go to this demo page for a Flickr picture example.

Via: devthought.com


March 22, 2009, 3:48pm