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

Question

如何更改图片在网页上加载的方式？我假设使用javascript来做到这一点。我正在寻找一种方法，以较低的分辨率使图像负载，然后“更清晰”。正如向下装载一样，如果这是有道理的。 Facebook通过他们的“剧院”图片弹出窗口来做到这一点。

Answer 1

这实际上是由于图像的编码方式，即隔行扫描的图像会产生这种效果。

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

检查你的图像编辑实用程序是否具有此功能，像photoshop这样的应用程序肯定会，但是像paint一样简单的东西不会。

Answer 2

听起来很像jpg图像中的渐进式加载。这是你在创建图像时必须调整的东西。我只熟悉gimp，你必须在导出到jpg时选中一个复选框。查看this screenshot。

实现这一目标的另一种方法是首先将网页上的图像指向较小的图像，然后使用一些jQuery插件执行一些操作。我现在不确定，但我认为有一个名为jQuery.lazyload或者某个。那样的。

希望它可以帮到你！

Answer 3

要做到这一点，你不需要javascript。它实际上是您保存图像的一部分。您应该使用渐进式选项制作图像。它在图像上增加了一点重量，但它会在加载时显示部分图像。

要在Photoshop上执行此操作：

1. 打开图像文件

2. 选择文件

3. 选择“存储为网络...”选项。

4. 在打开的Dialog上选择jpg

5. 在右上角有几个选项。选中'Progressive'选项

你完成了！

现在替换您的图片，所有浏览器都会在加载图片时显示该图片。