JS 自动加载图片
<html><head><title>图片自动加载</title><script type="text/javascript" src="http://www.loqall.com/js/jquery-1.7.1.min.js"></script><script>var globalcount = 0;function feedToolBar(id){ $(document).ready(function(){ $(window).bind("scroll", function(event){ var fold = $(window).height() + $(window).scrollTop(); if( fold >= $('#'+id).offset().top-20){ p = parseInt($('#'+id).attr('page')); nextpage = p+1; url =$('#'+id).attr('query'); maxpage = parseInt($('#'+id).attr('max')); if(globalcount == 1){return false;}//如果进入队列的就跳出 if(p >= maxpage) { $('#'+id).html('<img src="http://www.loqall.com/tpl/image/hand.gif" />look more...'); }else{ globalcount = 1; //已经进入队列了 $('#'+id).html('<img src="http://www.loqall.com/tpl/image/loading.gif" /><span>wait for a moment</span>'); $.post(url,{page:p},function(){ area = $('#'+id).attr('area'); $('#'+area).append('<li><img src="3.jpg" /></li><li><img src="4.jpg" /></li>'); $('#'+id).attr('page',nextpage); globalcount = 0; //出队列 }) } } }); });}</script></head><body><ul id="feedArea"> <li><img src="1.jpg" /></li> <li><img src="2.jpg" /></li></ul><div id="feedAjaxTool" page="1" max="4" area="feedArea" query="#" ></div><script>feedToolBar('feedAjaxTool');</script></body></html>TAG:
