jq 滚动加载

复制下来直接用

<style>
* ul {
	list-style:none;
	padding:0;
	margin:0;
}
.m {
	margin-left:auto;
	margin-right:auto;
	width:150px
}
li {
	width:150px;
	height:auto;
	border:1px dashed blue;
	margin-bottom:10px;
}

</style>

<div class="m">
    <ul>
        <li><img src="http://www.jq22.com/img/cs/500x300a.png" width="100%"></li>
        <li><img src="http://www.jq22.com/img/cs/500x300b.png" width="100%"></li>
        <li><img imgsrc="http://www.jq22.com/img/cs/500x300c.png" width="100%"></li>
        <li><img imgsrc="http://www.jq22.com/img/cs/500x300d.png" width="100%"></li>
        <li><img imgsrc="http://www.jq22.com/img/cs/500x300a.png" width="100%"></li>
        <li><img imgsrc="http://www.jq22.com/img/cs/500x300b.png" width="100%"></li>
        <li><img imgsrc="http://www.jq22.com/img/cs/500x300c.png" width="100%"></li>
        <li><img imgsrc="http://www.jq22.com/img/cs/500x300d.png" width="100%"></li>
        <li><img imgsrc="http://www.jq22.com/img/cs/500x300a.png" width="100%"></li>
        <li><img imgsrc="http://www.jq22.com/img/cs/500x300b.png" width="100%"></li>
        <li><img imgsrc="http://www.jq22.com/img/cs/500x300c.png" width="100%"></li>
        <li><img imgsrc="http://www.jq22.com/img/cs/500x300d.png" width="100%"></li>
    </ul>
</div>
<script>
$(window).scroll(function() {
    $('li[isLoaded != 1]').each(function() {
        var oT = $(this).offset().top;
        var sT = $(window).scrollTop();
        var cH = $(window).height();
        if (sT + cH >= oT) {
            var s = $(this).find('img').attr('Imgsrc');
            $(this).find('img').attr('src', s);
            $(this).attr('isLoaded', 1);
        }

    })
})
</script>