如何更改图片在网页上的加载方式？ （例如较低的分辨率）

Question

如何更改图像在网页上的加载方式？ 我想使用javascript来做到这一点。 我正在寻找一种方法，以较低的分辨率加载图片，然后获得“更清晰”的图像。 如果可以的话，建议向下加载。 Facebook通过其“剧院”图片弹出窗口来完成此操作。

Answer 1

这实际上是由于对图像进行编码的方式所致，即隔行扫描的图像将具有此效果。

http://en.wikipedia.org/wiki/Interlacing_(bitmaps ）

请检查您的图像编辑实用程序是否具有此功能，Photoshop之类的应用程序肯定可以，但诸如绘画之类的简单程序则不会。

Answer 2

为此，您不需要javascript。 这实际上是保存图像的一部分。 您应该使用渐进式选项制作图像。 它在图像上增加了一些权重，但是它将在加载图像时显示图像的一部分。

要在Photoshop上执行此操作：

1. 打开你的图片文件

2. 选择文件

3. 选择“保存为网站...”选项。

4. 在打开的对话框中，选择jpg

5. 在右上角有几个选项。 选中“渐进式”选项

大功告成！

现在替换图像，所有浏览器将在加载图像时显示该图像。

Answer 3

对我来说，听起来很像jpg图像中的渐进式加载。 创建图像时必须对此进行调整。 我只熟悉gimp，在导出到jpg时，您必须选中一个复选框。 查看此屏幕截图 。

实现此目的的另一种方法是，首先将网页上的图像指向较小的图像，然后使用一些jQuery插件进行处理。 我现在不确定，但是我认为有一个叫做jQuery.lazyload或sth的东西。 像那样。

希望对您有帮助！