<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript" src="http://yanpinquan.blog.163.com/blog/../jquery.min.js"></script>
</head>
<body>
<div id="table">
<table width="100%" border="0" cellpadding="10" cellspacing="10">
<tr>
<td align="center">
<img class="scrollLoading" src="http://yanpinquan.blog.163.com/blog/images/1.jpg" width="300" height="120" />
</td>
</tr>
<tr>
<td align="center">
<img class="scrollLoading" src="http://yanpinquan.blog.163.com/blog/images/2.jpg" width="300" height="120" />
</td>
</tr>
<tr>
<td align="center">
<img class="scrollLoading" src="http://yanpinquan.blog.163.com/blog/images/3.jpg" width="300" height="120" />
</td>
</tr>
<tr>
<td align="center">
<img class="scrollLoading" src="http://yanpinquan.blog.163.com/blog/images/4.jpg" width="300" height="120" />
</td>
</tr>
<tr>
<td align="center">
<img class="scrollLoading" src="http://yanpinquan.blog.163.com/blog/images/5.jpg" width="300" height="120" />
</td>
</tr>
<tr>
<td align="center">
<img class="scrollLoading" src="http://yanpinquan.blog.163.com/blog/images/6.jpg" width="300" height="120" />
</td>
</tr>
<tr>
<td align="center">
<img class="scrollLoading" src="http://yanpinquan.blog.163.com/blog/images/7.jpg" width="300" height="120" />
</td>
</tr>
<tr>
<td align="center">
<img class="scrollLoading" src="http://yanpinquan.blog.163.com/blog/images/8.jpg" width="300" height="120" />
</td>
</tr>
</table>
</div>
<div id="txt"></div>
<script type="text/javascript">
$(window).scroll(function(){
var documentTop = $(document).scrollTop();
var windowHeight = $(window).height();
var documentHeight = $(document).height();
//var txt = "windowHeight:"+windowHeight + " |*$*| documentTop:"+documentTop + " |*$*| documentHeight:"+documentHeight;
//当 documentTop >= (documentHeight-windowHeight) 说明滚动条已经滚动到底部了
if(documentTop >= (documentHeight-windowHeight)){
var tableTxt = $("#table").html();
$("#txt").append("<hr>" + tableTxt);
}
})
</script>
</body>
</html>
$(document).scrollTop() 获取垂直滚动的距离
即当前滚动的地方的窗口顶端到整个页面顶端的距离
$(document).scrollLeft()
这是获取水平滚动条的距离
要获取顶端 只需要获取到
scrollTop()==0的时候就是顶端了 要获取底端
只要获取scrollTop()>=（$(document).height()-$(window).height()）就可以知道已经滚动到底端了 $(document).height()
//是获取整个页面的高度 $(window).height()
//是获取当前 也就是你浏览器所能看到的页面的那部分的高度