Discuz图片延迟加载实现方法，华丽而又能加速的小技巧

dly · 发表于 2012-1-24 12:32:57

说在前面：
看了论坛里面很多人需要图片延迟加载，感觉这功能确实很不错
能加速站点的载入速度，而且加载很华丽。
代码只有几KB，轻巧方便。
这个特效是少有华丽加速的果，因为它能判断访客是不是在查看当前图片。

LazyLoad简介：

在页面上图片比较多的时候，打开一张页面必然引起与服务器大数据量的交互。尤其是对于高清晰的图片，占的几M的空间。ImageLazyLoad技术就是，当前可见界面的图片是加载进来的，而不可见页面（通过滚动条下拉可见）中的图片是不加载的，只是预加载一个很小的填充图片，等到访客滑动鼠标滑轮或浏览到图片位置时，真正的图片地址才会加载。这样势必会引起速度上质的提升。

LazyLoad使用方法：
1.后台---全局---SEO设置---其他头部信息
加入以下代码：

<script type="text/javascript" src="static/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="static/js/jquery.lazyload.js"></script>
<script type="text/javascript">
jQuery(document).ready(
function($){
$("img").lazyload({
placeholder : "static/js/grey.gif",
effect : "fadeIn"
});
});
</script>

复制代码

2.更新缓存即可。

JS下载包：

游客，如果您要查看本帖隐藏内容请回复

解压，将文件上传到论坛根目录即可。

图片渐显：
004819sxf253b33lacd8wv.jpg.thumb.jpg

学会遗忘 · 发表于 2012-1-24 13:54:22

这功能不错啊

子扬 · 发表于 2012-1-24 20:50:00

好像不错的说

idcider · 发表于 2012-1-25 02:26:43

idcider，如果您要查看本帖隐藏内容请回复

绣色摄影 · 发表于 2012-1-25 13:37:16

如果您要查看本帖隐藏内容请回复

阿兵 · 发表于 2012-1-25 13:41:25

dddddddddddddddddddddddddd

Patrick · 发表于 2012-1-25 14:24:30

不错不错 !!!!!!!!!!

迷失 · 发表于 2012-1-26 12:46:33

真是好办法，这样访问感受更好了。

susongren · 发表于 2012-1-26 21:41:39

这个确实是个非常实用的功能，象淘宝一样的。

dingfeng01 · 发表于 2012-1-26 21:51:02

好像不错的说

Discuz图片延迟加载实现方法，华丽而又能加速的小技巧

相关帖子