第一个轮子wlazyload插件。为了解决自己系统里面图片懒加载的简单插件

网上有lazyload的完整插件，但是用在我们系统里面总是有bug，所以，我觉得是他插件里面关于元素top值计算有问题，那么这么想就说干脆自己做一个简单的lazyloady插件吧，取名子wlazyload。

;(function($){
$.fn.wlazyload= function(option){
function getPageScroll() {
var xScroll, yScroll;
if (self.pageYOffset) {
yScroll = self.pageYOffset;
xScroll = self.pageXOffset;
} else if (document.documentElement && document.documentElement.scrollTop) {
yScroll = document.documentElement.scrollTop;
xScroll = document.documentElement.scrollLeft;
} else if (document.body) {
yScroll = document.body.scrollTop;
xScroll = document.body.scrollLeft;
}
function getscroll(lol,dota){
this.xscroll=lol;
this.yscroll=dota;
}
arrayPageScroll = new getscroll(xScroll,yScroll)
return arrayPageScroll;
};

function caltop(vrobj){
var vtop=vrobj.offsetHeight;
while(vrobj.offsetParent){
vtop+= vrobj.offsetTop;
vrobj = vrobj.offsetParent;
}
return vtop;
}

var gglazy=getPageScroll();
var screenheight=$(window).height();
var lazydata = {
lazyheight:100,
screenheight:screenheight
}
var that=this;
var options = $.extend(lazydata, option);
this.each(function(){
if(caltop(this)-gglazy.yscroll-options.screenheight<options.lazyheight && this.getAttribute("src")==undefined ){
this.src= this.getAttribute("data-origin");
}
return gglazy;
});
document.onscroll=function(){
gglazy=getPageScroll();
that.each(function(){
if(caltop(this)-gglazy.yscroll-options.screenheight<options.lazyheight && this.getAttribute("src")==undefined ){
this.src= this.getAttribute("data-origin");
}
return gglazy;
});
console.log('123');
}

}
})(jQuery);

上面就是我的插件的源码，但是我总是觉得在插件内部定义一个document.onscroll事件会影响性能。那么这个插件很简单，传入的参数有限。现在传一个lazyheight，表示当页面的图片距离浏览器的下方的位置lazyheight出开始加载。
使用方式

$('img').wlazyload();

当然，也可以设置参数
$('img').wlazyload({'lazyheight':200+'px'})

目前只加了一个功能，就是懒加载的基本功能，后续完善插件再来跟新，希望有高手能指出代码如何去优化。