圖片腳本懶加載 - Lazyload

jopen 9年前發布 | 10K 次閱讀 Lazyload 圖片展示jQuery插件 jQuery插件

一個輕巧的小程序 - Lazyload，100 行代碼。加上一個data-src屬性，能夠讓頁面中的圖片懶加載、textarea 中的腳本懶執行，有需要的可以拿過去用用，代碼邏輯比較簡單，也可以自己增強點功能，比如動態添加懶加載監聽等等。 

<script src=";


<div class="box">
  <div class="item"><img src data-src="img-path"></div>
  <div class="item"><textarea>alert(1)</textarea></div>
</div></pre>


It exports an api to global: 


new Lazyload('.box .item');


Params 


There are two param your can set: 


    

  • Lazyload.TAG, default is 'data-src', we set the lazyload image 'src' to null, then read 'data-src' attribute. for example: 
    • 



<img src data-src="THE-REAL-PATH" />


    

  • Lazyload.DISTANCE, default is 0, if you want to show the lazyload element in advance, you can set it to a positive number; 
    • 



項目主頁：http://www.baiduhome.net/lib/view/home/1447741261759
 本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！