const imgs = document.getElementsByTagName("img");
const viewHeight = window.innherHeight || document.documentElement.clientHeight;
let num = 0;
function lazyLoad() {
for (let i = num; i <= imgs.length; i++) { let distance = viewHeight - imgs[i].getBoundingClientRect().top; if (distance >= 0) { imgs[i].src = imgs[i].getAttritube("data-src") num = i + 1; } }
};
window.addEventListener("scroll", lazyLoad, false);
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/101279.html
摘要:使用默認是對象,如果是是指使用標簽,可以跨域,三懶加載和預加載的對比兩者都是提高頁面性能有效的辦法,兩者主要區別是一個是提前加載,一個是遲緩甚至不加載。懶加載對服務器前端有一定的緩解壓力作用,預加載則會增加服務器前端壓力。 一、懶加載 1.什么是懶加載 showImg(https://segmentfault.com/img/remote/1460000016666819); 懶加載也...
摘要:圖片的預加載是提升用戶體驗而損失性能的一種做法,而懶加載的性能就比較好了,所以將兩個結合起來放到程序中是一種不錯的選擇。 最近在做H5滑頁時,遇到一些比較大的場景,動輒二十、三十頁,而圖片更是可恨的能達到上百個,所以就會導致場景在加載的時候遇到網速比較慢的時候,用戶等待的時間特別長,這樣的話,就有可能導致一部分的用戶沒有耐心,而丟失這部分用戶,于是就有了這里的圖片的預加載和懶加載,記個...
摘要:景科同學的想法很簡單,因為本人目前還是一個前端小白,只有通過不斷的寫,不斷的學,在與的相愛相殺中才能更快速的進步。本項目是景科同學自寫自測,雖然比較簡單,但是不保證沒有隱藏的。所以如果看官同學發現還望留言指正,景科同學在此以示感謝。 showImg(https://segmentfault.com/img/remote/1460000014251310?w=841&h=630); 本文...
閱讀 2950·2021-11-23 09:51
閱讀 3776·2021-11-22 15:29
閱讀 3226·2021-10-08 10:05
閱讀 1552·2021-09-22 15:20
閱讀 952·2019-08-30 15:56
閱讀 1069·2019-08-30 15:54
閱讀 733·2019-08-26 11:54
閱讀 2636·2019-08-26 11:32