所谓图片异步加载,意思是毫无1遍把图片全体加载完,你能够叫它延迟加载,缓冲加载都行。

看望您有没有那种必要:某篇文章图片很多,倘诺在载入作品时就载入全数图片,无疑会延迟载入速度,让用户等更久,所以,小编想找这么一种插件,让网页只加载浏览器视野范围内的图片,没出今后范围内的图纸就暂不加载,等用户滑动滚动条时再稳步加载。lazyload正是用来贯彻那种意义。

lazyload.js其实是jQuery的1个插件,全称是jquery.lazyload.js,看它的名字就知晓它的功力了——正是偷懒载入的情致。由于它是javascript写的,所以适用于拥有网页,包涵Wordpress。

想要使用lazyload,得先载入jQuery,它是凭借jQuery来落到实处效益的。至于jQuery,大家不用去下载了,能够一贯连接存放在谷歌服务器上的jQuery文件,永远不要操心丢掉(当然,要是有天朝完全挡住谷歌(Google)的那一天的话……)

减去包中除去lazyload.js外,还有1个grey.gif图片文件。这一个图形的效果是,当页面上海体育地方片未载入时,就突显那张图片。

//先载入jquery

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

//再载入lazyload

<script type="text/javascript" src="http://www.jo2.org/js/jquery.lazyload.js"></script>

<script type="text/javascript">

jQuery(document).ready(

function($){

$("img").lazyload({

     placeholder : "http://www.jo2.org/js/grey.gif", //加载图片前的占位图片

     effect      : "fadeIn" //加载图片使用的效果(淡入)

});

});

</script>

相关文章

网站地图xml地图