1：引入

<script type="text/javascript" src="assets/js/jquery.lazyload.min.js"></script>

2：html部分

<img class="lazy" data-original="assets/img/bmw_m1_hood.jpg" width="500px" height="500px">

備註：新增class是為了方便下面的js控制/   2.data-original=“”屬性是真是圖片地址  3.width和height兩個屬性必須設定不然圖片會始終出現在顯示區

3：js控制部分

$("img.lazy").lazyload({
        effect: "fadeIn",                                        //這個是顯示效果 還有 show 和 sildeshow
        placeholder : 'assets/img/grey.gif',          //這個是載入前的顯示圖片

        threshold :20,                                          //滾動到距離圖片20px時，圖片就開始再開始載入
        event : "click",                                         //圖片點選後，才開始載入
        container: $("#container"),                      //在滾動容器內的時候用這個，其中後面是選中的容器的id，前提是容器有scroll
        failure_limit : 10,                                     //頁面佈局圖片的順序和html圖片程式碼的順序不一致;它會導致本該載入的沒有載入,用它，儘量設定的高些
        skip_invisible : true,                                //為了提升效能，外掛預設忽略隱藏的圖片；如果想要載入隱藏圖片.設定skip_invisible為false;

      });