加速图片类点点博客

11:45 上午 ・0 comments ・Topic：
点点网是国内新起的类Tumblr轻博客，近期在国内流行，适合要求轻便，但又能模板定制的朋友。这里是模板中心，含大量的点点主题。

今天主要介绍一下利用jQuery加速图片类点点网站（含图片较多的网页），主要利用一个叫Lazy Load的jQuery插件，最新版本是1.7.0,对英文有限的朋友这里提供Lazy Load（中文档）.今天主要介绍一下在点点博客里应用Lazy Load，如果你需要在其它图片网站或Wordpress博客中应用此插件，请进入Lazy Load（中文档）自行设置，这里不作详细介绍。


首先，需要加载jQuery跟 Lazy Load ，点点的许多模板里已加载了jQuery，如果是这样，你这只需要下载 Lazy Load 放在"<Body></Body>"即可。在这里给需要的朋友提供下方便，已下载至Sinaapp空间，代码如下：
<script type="text/javascript" src="http://1.sdcs.sinaapp.com/jquery.lazyload.min.js"></script>
进入点点首页－需要设置的博客，点击“博客设置”，找到“自定义HTML”，将上面的Lozy Load代码放在<Meta>标签之后即可。

其次，查找”{/photos.single}“，在后面找到第一个“{?photos.multi}”标签(视模板而)，找到其后面IMG标签，将“src＝“图片地址”换成“src=等待图片地址  data-original="图片地址"”，在这里你需要一个等待图片地址，最好是1px，上网搜索一下或引用原Lozy Load Demo页中的等待图片。

最后，在</Body>前增加以下代码，即可。

<script type="text/javascript" charset="utf-8">
      $(function() {
         $("img[data-original]").lazyload();
      });
  </script>  

这样就能实现Lazy Load的效果了. 效果页

总结：本文只是提示一个方法，此方法经Firefox，IE，Chrome浏览器测试，只有当滚动条往下拉时，图片才会被下载，Lazy Load（中文档）中还介绍了加载时效果及其它自定义方法，要详细了解自行研究，本文适合图片较多的点点博客。同样也适用于图片类网站。