扩展图像而不进行平滑处理

Question

有没有可能放大一个img元素，使它看起来仍然是“像素化的”？正如您在这个示例( http://jsfiddle.net/4qgSc/ )中看到的那样，我测试过的所有浏览器都使用了一些“平滑”的-effect。在画布中重新绘制它不是一个可能的解决方案，因为我想要动画放大。

编辑:现在使用具有以下属性的类：

image-rendering: optimizeSpeed;
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-optimize-contrast;
-ms-interpolation-mode: nearest-neighbor;

获取关闭结果。它适用于除Chrome (16.0.912.75 m)以外的所有浏览器。

Answer 1

我想你要找的是CSS image rendering property.

http://jsfiddle.net/alpacalips/4qgSc/5/

Answer 2

一种可能的解决方案是展开所有图像( http://jsfiddle.net/4qgSc/1/ )。您的图像可以使用Photoshop中的动作(宏)或其他图像编辑软件中的“最近邻”模式轻松转换：

​

​