js 图片延时加载

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="智能社 - zhinengshe.com">
<meta name="copyright" content="智能社 - zhinengshe.com">
<title>智能社 - www.zhinengshe.com</title>
<style>
* { margin:; padding:; }
li { float:left; width:310px; height:310px; border:1px solid red; list-style:none; margin:5px; }
</style>
<script>
window.onload=window.onresize=window.onscroll=function (){
    var aImg=document.getElementsByTagName('img');
    var scrollTop=document.documentElement.scrollTop || document.body.scrollTop;
    var scrollBottom=document.documentElement.clientHeight+scrollTop;//可是区域高度+滚动高度

    for (var i=; i<aImg.length; i++)
    {
        var top=getPos(aImg[i]).top;

        if (top<scrollBottom)
        {
            // 图片在可视区内
            aImg[i].src=aImg[i].getAttribute('_src');
        }
    }
};

function getPos(obj){
    var l= ;
    var t= ;
    while(obj){
        l += obj.offseLeft;
        t += obj.offsetTop;
        obj = obj.offseParent;
    }
    return {left:l,top:t};
}
</script>
</head>

<body>
    <ul>
        <li><img _src="data:images/m1.jpg" /></li>
        <li><img _src="data:images/m2.jpg" /></li>
        <li><img _src="data:images/m3.jpg" /></li>
        <li><img _src="data:images/m4.jpg" /></li>
        <li><img _src="data:images/m5.jpg" /></li>
        <li><img _src="data:images/m6.jpg" /></li>
        <li><img _src="data:images/m7.jpg" /></li>
        <li><img _src="data:images/m8.jpg" /></li>
        <li><img _src="data:images/m9.jpg" /></li>
        <li><img _src="data:images/m10.jpg" /></li>
    </ul>
</body>
</html>