zoukankan      html  css  js  c++  java
  • 页面的懒加载

            '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);
                }
            },
     $(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);
        });
    

      

  • 相关阅读:
    COPY SAP 标准gui状态
    销售类型转换
    SAP数据表相关
    T_CODE I18N
    SAP-Function
    MLGBZ
    爷爷的烟斗
    使用 Composer 查看 FastAdmin 项目 组件的版本
    FastAdmin 后台前端后端组件说明(待续)
    FastAdmin 在 Nginx 中的配置
  • 原文地址:https://www.cnblogs.com/coding4/p/5864490.html
Copyright © 2011-2022 走看看