今家介绍如何让图片优雅地显示
起初打开一篇文章加载动画很久
下面的演示仅是因为浏览器已缓存
实际第一次访问页面时须等待许久
实际上我只是想要页面加载动画
并不希望等待网页图片全部加载
于是我想到了图片懒加载功能
什么是图片懒加载？
当打开一个页面时，只加载页面可视区域的图片，等页面滚动时，再加载需要显示的图片。
图片懒加载的优点？
减少或延迟请求数，缓解服务器压力，增强用户体验。
我记得网站主题设置好像有
但我找来找去就是没找到
应该是上个主题Dobby的功能
于是上网搜索添加的办法
本想用代码法自己添加解决
奈何实力不够，不明白具体操作
于是转而使用WordPress插件
最终效果演示
插件商店一搜还不少呢！
于是在电脑本地网站上试
试了几个插件最终选择了
Lazy Load Optimizer
主要喜欢它自定义加载动图
外观-自定义-Lazy load Settings
自定义动图貌似不好使
那咱暴力替换动图
可以设置排除的class/url/page等
好了下面我们来介绍动图制作
素材可到千图网下载(58pic.com)
使用Photoshop 2017演示
调出时间轴：窗口-时间轴
编辑图层比如加背景图
图像-图像大小
导出GIF动图
如果要导出透明背景的动图
则选择杂边选无，然后存储
分享一下搜集的动图
另附修改Dux主题默认缩略图
位置dux/js/main.js 图片dux/img
—End—
封面图：bongkarn thanyakij on Pexels
扩展阅读
技术松鼠瞧，免费开源的赞赏系统！喜欢就点一下在看呗！
