今天学习了MUI框架中的图片懒加载的使用,第一次使用比较好奇,然后就想翻出源码来研究研究,下面先上源码:
huibase.lazyLoadNow = function(className){
if(!className){className = 'HUI_Lazy';}
var winInfo = hui.winInfo(), imgs = new Array(), lazyObj = hui('.'+className);
for(var i = 0; i < lazyObj.length; i++){
var dom = lazyObj.dom[0], realSrc = dom.getAttribute('lazySrc');
var setsY = hui.offset(dom);
if(setsY.top >= winInfo.height + winInfo.scrollTop){break;}
dom.src = realSrc;
hui(dom).removeClass(className);
}
};
huibase.lazyLoadNow = function(className){
//建立函数lazyLoadNow,接受一个值(className)
//如果没有传入值,那么className默认为HUI_Lazyif(!className){className = 'HUI_Lazy';}
//定义对象winInfo,imgs,lazyObj并分别赋值 imgs为数组 lazyObj为.className;var winInfo = hui.winInfo(), imgs = new Array(), lazyObj = hui('.'+className)
for(var i = 0; i < lazyObj.length; i++){ //for循环
//创建dom对象,将第一个className为HUI_Lazy的对象赋予它,var dom = lazyObj.dom[0], realSrc = dom.getAttribute('lazySrc');
//创建realSrc对象,将lazySrc的属性值赋予它 注:这里的dom.&&.dom 都是讲对象转换为.DOM对象的方法
var setsY = hui.offset(dom);
//创建setsY对象,将dom当前的位置赋值给setsY
if(setsY.top >= winInfo.height + winInfo.scrollTop){break;}
//如果setsY的top位置大于等于窗口当前的高度+窗口滚动条当前的顶端位置的值则结束循环 dom.src = realSrc;
//那么第一个className为HUI_Laz的对象的src值就等于realSrc hui(dom).removeClass(className);
//选择这个dom移除当前的className
} };