日常懒一下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html> <head> <title> New Document </title> <script> /* * clientHeihgt:浏览器窗口高度 scrollHeight:页面高度 scrollTop:滚动距离 浏览器窗口高度与页面高度是不变的,随着页面往下移动, 滚动距离会越来越大,当滚动到最底部时, 滚动距离+窗口高度=页面高度 * */ window.onscroll = function (){ var marginBot = 0; if (document.documentElement.scrollTop){ //IE、火狐浏览器 marginBot = document.documentElement.scrollHeight- document.documentElement.scrollTop- document.documentElement.clientHeight; } else { //谷歌浏览器 marginBot = document.body.scrollHeight- document.body.scrollTop- document.documentElement.clientHeight; } if(marginBot<=0) { //alert("滚动到底部"); addimg(); //加载图片 } } function addimg(){ var html="<li><img src='img/6.jpg'></li>"; document.getElementById("imgs").innerHTML +=html; } </script> </head> <body> <ul id="imgs"> <li><img src="img/1.jpg" width="380" height="285" border="0" alt=""></li> <li><img src="img/2.jpg" width="380" height="285" border="0" alt=""></li> <li><img src="img/3.jpg" width="380" height="285" border="0" alt=""></li> <li><img src="img/4.jpg" width="380" height="285" border="0" alt=""></li> <li><img src="img/5.jpg" width="435" height="466" border="0" alt=""></li> </ul> </body></html>