页面的懒加载
'lazyQueue': {}, 'isVisiable': function(elem) { if (!elem) return false; // console.log(($(window).scrollTop()+"::"+($(elem).offset().top+$(elem).outerHeight()))+"::"+(($(window).scrollTop()+$(window).height())+"::"+$(elem).offset().top)) return ($(window).scrollTop() <= ($(elem).offset().top + $(elem).outerHeight())) && (($(window).scrollTop() + $(window).height()) > $(elem).offset().top); }, 'lazyload': function(elem, htmlcode, item, cb) { elem.html(htmlcode.html); elem.css('display', 'block'); if (elem && elem.length != 0) { var top = elem.offset().top; if (this.isVisiable(elem)) { this.showImg(elem); cb && cb.apply(this, arguments); return; } if (this.lazyQueue[top]) { this.lazyQueue[top].push({ 'elem': elem, 'html': htmlcode, 'item': item, 'loaded': false, 'callback': cb }); } else { this.lazyQueue[top] = [{ 'elem': elem, 'loaded': false, 'callback': cb }]; } } }, 'showImg': function(elem) { var imgs = elem.find('img'); for (var i = 0; i < imgs.length; i++) { $(imgs[i]).attr('src', $(imgs[i]).attr('data-src')).fadeIn(500); } },
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | $(window).bind( "scroll" , function () { var Ad = LETV.using( 'Plugin' ).AD; if (Ad.lazySt) clearTimeout(Ad.lazySt); Ad.lazySt = setTimeout( function () { var curHeight = $(window).height() + $(window).scrollTop(), lazyQueue = Ad.lazyQueue; for ( var key in lazyQueue) { if (lazyQueue.hasOwnProperty(key)) { var item = lazyQueue[key]; if (!item) continue ; for ( var j = 0; j < item.length; j++) { var mItem = item[j]; if (mItem && !mItem.loaded && Ad.isVisiable(mItem.elem)) { if (mItem.loaded === false ) { mItem.cb && typeof mItem.cb == 'function' && mItem.cb(); Ad.showImg(mItem.elem); mItem.loaded = true ; } else { mItem = null ; } } } } } }, 200); }); |
【推荐】还在用 ECharts 开发大屏?试试这款永久免费的开源 BI 工具!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步