2011-05-25 70 views
10

我注意到,IE9呈现在一个非常低的质量小图像:如果我在200x150 IMG标签显示800x600 jpg图像,在IE9的结果是非常令人失望。质量差的图像尺寸在IE9

在IE8和Chrome中,相同的页面显示效果非常好。 IE7也行,只要我使用CSS样式-ms-interpolation-mode: bicubic;)。 Firefox显示的结果与IE9相同,但这似乎是一个已知的bug,请参阅https://bugzilla.mozilla.org/show_bug.cgi?id=486918

我已经浏览了堆栈溢出和其他论坛,但没有发现IE9渲染与IE8的任何投诉。

有没有人知道这是IE9中的一个错误。有没有解决方法?

我无法提交图像,因为我是堆栈溢出的新用户。 但可以很容易地重现该问题:

在Paint.Net创建与刷宽度1只或2 显示一个椭圆。一个800x600.jpg这个图像中的200像素150像素IMG标签 比较IE9用铬和IE8(使用IEtester)

+3

我会考虑客户端的图像重新调整一般糟糕的做法。除了浏览器之间的渲染差异之外,还会通过下载比所需字节更多的字节来影响性能,然后处理渲染图像的时间。 – Xint0 2011-05-25 15:27:23

+0

如果您无法直接在帖子中嵌入图片,您可以随时将其留在评论中或作为链接,任何具有编辑权限的人都可以为其编辑 – 2011-05-27 03:30:16

+1

@ Xint0 - 如果您在其他地方显示较大的图片,那么具有不同大小的多个图像会导致更大的下载量。 – 2012-08-15 14:24:17

回答

2

我已经看过很多与IE和图像大小调整。实际上,通过图像编辑器或自动化方式制作单独的较小版本的确切尺寸会更好。

4

默认即图像调整大小算法不是很好。当你注意,IE7添加到更改算法的能力:

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

这带走IE9 according to the docs page,但他们不提供,如果有什么事情,而不是使用任何信息。如果您可以设法在浏览器中调整图片大小,您将获得最佳效果。

根据您的使用情况,您可能可以使用具有较新浏览器的画布来获得更好的结果。在Resizing an image in an HTML5 canvas接受的答案看起来很有前途:)

+0

Thanx为您的答复。不幸的是,我的applciation设计暂时阻止了我使用Canvas。所以我会尝试在服务器上以编程方式调整图像大小。顺便说一句:我注意到这个渲染问题只发生在绘制图像上。调整大小的照片在IE9中的外观非常好。 – Koos 2011-05-27 08:18:06

+0

感谢除IE之外的提及,我正在抓我的头看着IE9中的图像,直到我读到它! – ChristoKiwi 2015-09-04 02:37:56