search

cloudtian / blogs

Summary of knowledge and blogs for every little things
3 stars 0 forks source link

图片渐进式加载效果 #31

Open cloudtian opened 4 years ago

cloudtian commented 4 years ago

方式

浏览器下载图片的时候渐进式载入。

  1. 图像隔行扫描的方式，在gif/png中实现。 比如先出奇数行，再出偶数行，造成图像是逐渐变清楚的。
  2. 渐进式扫描的方式，在jpg中实现。 让图片先以比较模糊的形式显示，随着图像文件数据不断从网上传过来，图像会逐渐变清晰。

photoshop中保存图片的方式

  1. 保存png格式图片 image 此处选交错即可实现隔行扫描的效果

  2. 保存jpg格式图片 image 此处选连续即可实现渐进式扫描的效果

效果

img-load

demo地址