div超长内容分页

$(function () {
    function showPage(index) {
        var i = parseInt(index);
        obj.scrollTop = (i - 1) * parseInt(obj.offsetHeight);
    }
    var obj = document.getElementById("article");
    var pages = document.getElementById("pages");
    var allpages = Math.ceil(parseInt(obj.scrollHeight) / parseInt(obj.clientHeight));
    pages.innerHTML = "<b>共" + allpages + "页</br>";

    for(var i=1;i<=allpages;i++)
    {
        pages.innerHTML += "<a href=‘#‘ id="+i+">"+"第"+i +"页"+"</a>&nbsp;";
    }
    $("a").on("click", function (e) {
        var c = e.target;
        showPage(c.getAttribute(‘id‘));
    });
});
时间: 2024-11-03 03:25:23

div超长内容分页的相关文章

CSS实现DIV超长截断,并显示...

DIV显示内容有时会超长,并把页面撑的很难看, 以前的做法是在JS中,或者后台判断其长度,过长就截断, 但由于中英文数字展示的宽度并不一样,截断的长度也就只能取最小值, 展示的效果也不好.利用CSS提供的方法,可以完美的解决该问题. 1 .project-Name{ 2 width:280px; 3 overflow:hidden; 4 text-overflow:ellipsis; 5 white-space: nowrap; 6 } 这里宽度是必须定义的, overflow:hidden;表

php文章内容分页并生成相应的htm静态页面代码

代码如下: <?php $url='test.php?1=1'; $contents="fjka;fjsa;#page#批量生成分成文件并且加上分页代码"; $ptext ='#page#'; ContentsPages($url,$contents,$ptext) /** * 函数名:ContentsPages * 功能:文章内容分页 * 参数:$url文章内容页URL 类型string,$contents文章内容页内容 类型string,$ptext分页标识 类型string

spring mvc +HTML5实现移动端底部上滑异步加载更多内容分页效果

由于手机的携带的方便性和手机的越来越智能和移动网速越来越快,手机已经充斥着人们的生活.随着手机的流行, 移动应用也快速的火了起来比如微商城.手机网页.移动APP等等.既然移动应用这么火,我们今天来讲一下怎样实现在移 动网页中动态加载数据,那么我们怎么实现呢,是像pc网页那样,有个上一页和下一页还是其它的方式. 其实像pc网页那样上一页和下一页肯定不行的,手机屏幕很小,不好点击同时用户体验很差,今天来给大家介绍使用 spring mvc +HTML5实现移动端底部上滑异步加载更多内容分页效果的方式

Asp.net文章内容分页

#region Html内容分页处理函数 /// <summary> /// Html内容分页处理函数 /// </summary> /// <param name="strBody">要分页的内容</param> /// <param name="strSplitString">分隔字符串</param> /// <param name="pageIndexName"

让2个并列的div根据内容自动保持同等高度js

有左右2个并列的div,2个div都不能限定高度.左div为导航,右div为内容.如何能让左div块自动获得和右div块相等的高度? 同时,也有网友提问到“如果右块高度比左块低,会不会导致左块的内容被溢出不显示之类的问题.应该是取左右2者的最高值吧来对齐吧”. 的确应该是哪个div Height值大,就将其值赋给Height值小的div,从而使2个div高度始终保持一致. function $(id){ return document.getElementById(id) } function

DIV的内容自动换行

word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行. 它们的区别就在于: 1,word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congratulation等),它会把单词截断,变成该行末端为conra(congratulation的前端部分),下一行为tulation(conguatulation)的后端部分了. 2,word-wrap:break

【ASP】对数据库查询的内容分页显示算法的改进

上次写的<[ASP]数据库查询的内容分页显示>(点击打开链接)中的实现算法虽然能够在一个特定的表中实现了预想的效果, 但是这一算法移植到其他系统之后,发现通用性不强 首先此分页算法的具体实施是通过数据库后台的ID号的区分每一页的, 在一些表中,如果查询出来的ID结果是乱序的,此算法则会失效. 同时,翻页的链接是写死的,没有实现宏,来确定此页的名称. 所以,必须通过大量的修改,实现此算法,但是根本的思想还是没变的,也算是[ASP]数据库查询的内容分页显示v2吧! 一.基本思想 1.页面的名称可以

如何让2个并列的div根据内容自动保持同等高度

最近在工作中碰到一个需求: 有左右2个并列的div,2个div都不能限定高度.左div为导航,右div为内容.如何能让左div块自动获得和右div块相等的高度?刚进公司好一段纠结那个时候技术好垃圾的路过(现在也很垃圾) 请看代码 function $(id){ return document.getElementById(id) } function getHeight() { if ($("left").offsetHeight>=$("right").of

将div的内容生成清晰的PDF、高清PDF

//需要引入html2canvas.js.jquery.js文件 html: <button type="button" class="btn btn-primary " id="pdfDown" >PDf导出</button> js: $("#pdfDown").on('click',function(){ var element = $(".orgchart"); // 这个do