看了论坛里面很多人需要图片延迟加载,感觉这功能确实很不错 能加速站点的载入速度,而且加载很华丽。 仔细看了下,19楼的加载代码太臃肿,于是自己进行了精简 这个特效是少有华丽加速的果,因为它能判断访客是不是在查看当前图片,只是预加载一个很小的填充图片,等到访客滑动鼠标滑轮或浏览到图片位置时,真正的图片地址才会加载。 演示效果请看 伊犁霍城县的薰衣草基地景区薰衣草什么时候开,有什么攻略? http://www.0999m.com/thread-2634-1-1.html (出处: 便民信息网) 我们用的VPS或者云主机大多是1M-5M的带宽,可有时候单页图片太多了,在访问量大的情况下,会随时导致带宽到5M峰值。 这种情况下,最好的办法就是对图片做延迟加载,这样一来不仅访客打开网页快,而且对咋们的云主机带宽也起到很好的协调作用,不至于瞬间高带宽占用。 网上很多延迟加载代码都是浏览器显示到某个位置的时候才开始加载,这样体验很不爽。我对代码做了些优化, 优化后的代码是:即将浏览到的时候就开始加载,等浏览到的时候已经完全显示出来了,访客甚至感觉不到用了图片延迟加载,用户体验相当好!而且js代码还很少,只有2KB。 现在分享给新疆SEO的朋友们,使用方法非常的简单哦! 下载js文件 把以下代码复制到网站的head标签内
<script type="text/javascript" src="js/lazyload/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/lazyload/jquery.lazyload.js"></script>
<script type="text/javascript">
jQuery(document).ready(
function($){
$("img").lazyload({
placeholder : "js/lazyload/grey.gif",
effect : "fadeIn"
});
});
</script>
注意路径
新疆SEO点评:本代码适用于所有网站和cms【discuz也可以使用不用担心jq冲突】