jquery圖片延遲加載方案解決圖片太多加載緩慢問題

當在做一個圖片展示站的時候，一個頁面加載的圖片過多會，如果服務器的帶寬跟不上，明顯會感覺到頁面很卡，嚴重的瀏覽器也會崩潰，所以我推薦采用即看即所得的模式，當滾動到下一屏時才進行加載圖片。

注意：即便如此，也希望保持圖片的大小不要太大，例如上傳一個1M的圖 在頁面中顯示，當有100張時，可想而知，100M的圖片需要加載，所以推薦將圖片進行裁剪或者壓縮處理展示，特別是列表頁！

<script type="text/javascript" src="jquery.lazyload.js"></script>
<script type="text/javascript" src="jquery.scrollstop.js"></script>
$(function(){
　　　　//延遲加載圖片 
　　　　$("img.lazy_load").lazyload({ 
　　　　　　event: "scrollstop", //滾動加載
　　　　　　effect : "fadeIn" //淡入
　　　　}); 
})

<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>
<img src='1.jpg' class='lazy_load'/>