不知道大家是否已经习惯了，打开一个网页之后，在网速慢的情况下，看着图片从上到下一点点的显示。但是如果你打开百度的图片搜索显示页面，就会发现，它的展示形式和我们的习惯上是不一样的。它有个从模糊到清晰的过程。大家可以自行百度任何一张图片来感受一下。下面的这2个对比效果图，是从网络上盗的图，这里向原作者表示感谢。这个图做的太好了，无法超越。大家看看对比效果。

前端图片优化显示，PHP修改图片交错渐进显示 - jiaocuo_1
前端图片优化显示，PHP修改图片交错渐进显示（图6-1）

前端图片优化显示，PHP修改图片交错渐进显示 - jiaocuo_2
前端图片优化显示，PHP修改图片交错渐进显示（图6-2）

在photoshop保存图片为png和gif格式的时候，是有这个交错显示的选项的。当保存为jpg格式的时候，选项中的“连续”就是我们所期待的“交错”效果。见下图。

前端图片优化显示，PHP修改图片交错渐进显示 - png_jiaocuo_01
前端图片优化显示，PHP修改图片交错渐进显示（图6-3）

前端图片优化显示，PHP修改图片交错渐进显示 - png_jiaocuo_02
前端图片优化显示，PHP修改图片交错渐进显示（图6-4）

前端图片优化显示，PHP修改图片交错渐进显示 - png_jiaocuo_03
前端图片优化显示，PHP修改图片交错渐进显示（图6-5）

本篇文章中，苏南大叔不是教大家使用PS的，所以，这里就不展开叙述了。我们说的是如何利用PHP做这个事情。注意，php.ini中必须开启GD库，不会开启的，请查看苏南大叔的其他php文章。https://newsn.net/tag/php/ 。

代码非常简单，如下：

$image = imagecreatefromjpeg("youpath/to/imagefile");
imageinterlace($image,1);
imagejpeg($image,"youpath/to/imagefile");
imagedestroy($image);

其中关键函数就是 imageinterlace ，具体说明，参见这里：https://doc.php.sh/zh/function.imageinterlace.html 。

苏南大叔的博客，很早之前就启用了水印功能，https://newsn.net/say/blog-enable-watermarker.html 。所以，这里，我对原有的水印功能，做了点小小的修改。使之能够支持图片交错模式。

前端图片优化显示，PHP修改图片交错渐进显示 - png_jiaocuo_00
前端图片优化显示，PHP修改图片交错渐进显示（图6-6）

就加了这么一句话，然后苏南大叔的博客水印图，全部都被“交错”显示了。很不错的说。

 【源码】本文代码片段及相关软件，请点此获取

 【绝密】秘籍文章入口，仅传授于有缘之人   php

本站的忠实读者小伙伴，正在阅读下面这些文章：

欢迎转载传播本篇原创文章，转载请保留链接及作者信息。
欢迎指正文字或逻辑错误，将会择优在文末列出您的信息。
本站采用创作共用版权协议, 要求署名、非商业用途和相同方式共享。
转载本站内容必须也遵循“署名-非商业用途-相同方式共享”的创作共用协议。
未经许可，规模化镜像抄袭本站内容的行为，将会根据有关法律法规进行维权。
《程序如此灵动~》下所有原创文章，如被用于商业用途，请您按规定支付稿费。

苏南大叔需要你的支持

PHP高手欢聚QQ群：218127186     逗逼虎开心聊QQ群：175454274

感谢您的打赏，让我更有动力，将更多精彩教程文章，呈现给大家！谢谢！