javascript - 像素化跨浏览器图像缩放

Question

我想用scale = 2.0放大图像。我希望不进行任何平滑处理，因此所需的效果是将原始图像的每个像素变成相同颜色的 2x2 像素。

我想知道这是否可以在 Javascript/CSS 中以跨浏览器(>= IE7)的方式完成，而无需诉诸 <canvas />标签。

Answer 1

抱歉，我不相信您想要的效果在没有 Canvas 的情况下可以跨浏览器实现。

在 Firefox Canvas 中，您可以执行 ctx.mozImageSmoothingEnabled = false; 但这已经是您所能达到的最接近结果了。

image-rendering: -moz-crisp-edges; 可能会帮助您在 Firefox 中进行 CSS 缩放，而 -ms-interpolation-mode* 可能会在 IE 中帮助您，但我怀疑您会得到一个在所有浏览器上看起来都相同的解决方案。

* 我认为这已被弃用/废弃。