由于工作需要
div固定大小 而内容不定 所以 如果内容过多自然就显示不出来了 所以 需要分页一类的功能下面是代码
<!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=gb2312" /> <title>根据div高度判断分页的代码</title> </head> <body> <div id="frameContent" style="605px;height:400px"> 内容 内容 很多很多内容 </div> <div id="pages" style="font-size:12px; 605px; line-height:40px; text-align:center;"> 分页 页数 </div> <script language="javascript"> var obj = document.getElementById("frameContent"); //获取内容层 var pages = document.getElementById("pages"); //获取翻页层 var pgindex=1; //当前页 window.onload = function() //重写窗体加载的事件 { var allpages = Math.ceil(parseInt(obj.scrollHeight)/parseInt(obj. offsetHeight));//获取页面数量 pages.innerHTML = "<b>共"+allpages+"页</b> "; //输出页面数量 for (var i=1;i<=allpages;i++){ pages.innerHTML += "<a href="javascript:showPage('"+i+"');">第"+i+"页</a> "; //循环输出第几页 } pages.innerHTML += " <a href="javascript:gotopage('-1');">上一页</a> <a href="javascript:gotopage('1');">下一页</a>" } function gotopage(value){ try{ value=="-1"?showPage(pgindex-1):showPage(pgindex+1); }catch(e){ } } function showPage(pageINdex) { obj.scrollTop=(pageINdex-1)*parseInt(obj.offsetHeight); //根据高度,输出指定的页 pgindex=pageINdex; } </script> </body> </html>
其实 就是 在计算 div的显示高度 和内容高度 获得到一共多少页 显示的第几页也就是 从多少像素开始显示而已