我要实现一段文字滚屏从下到上,滚到最后一行时,不动,如果下面加了一行文字,又向上滚动一行。内容是实时更新的。
如 。我有这么一段文字:
1111111111
2222222222
3333333332
4444444444
5555555555
6666666666
从底部向上滚动,滚到6666666666出现的时候就停止滚动。如果下面新增了一行777777777,就向上滚一行。

解决方案 »

  1.   

    做成表格,显示时用DISPLAY控制,再通过AJAX每隔指定时间取后台数据替换现有数据
    再用个计数器记录上次循环到最后一条时的位置,继续从这个位置往后显示
      

  2.   

    楼主需要的是类似聊天室或者网络文字直播那种显示屏的滚到页面底部的功能。其实这个很简单
    scrolltop=scrollheight就行了。如果内容更新你能控制,那么就在内容更新地语句后面加上这一句。这样是最好的,消耗资源比较少。如果内容更新的地方你不能控制,那就用一个interval不断设置就行了。不过用interval有一个缺点,就是用户如果手动滚到上面的时候,代码又把他滚到下面,显得非常不友好。
    代码如下,楼主根据需要,把两个注释掉的语句用其一就可以了。<div id="infodiv" style="border:1px solid red;height:400px;overflow:scroll;"></div>
    <input id="text1" /><input type="button" id="btnsend" value="send" onclick="sendmsg()" />    function sendmsg() {
            if (document.getElementById("text1").value != "") {
                document.getElementById("infodiv").innerHTML += "<br/>+ " + new Date().toString() + " " + document.getElementById("text1").value;
                //document.getElementById("infodiv").scrollTop = document.getElementById("infodiv").scrollHeight;            
            }
        }
       // window.setInterval('document.getElementById("infodiv").scrollTop = document.getElementById("infodiv").scrollHeight',1000);
      

  3.   

    <div id="textdiv" style="position: relative">
        <div id="innertext" style="position: absolute">
            <span>123</span>
            <span>321</span>
        </div></div><script>
        var innerText = document.getElementById( 'innertext' ),
            text = document.getElementById( 'textdiv' ).getElementsByTagName( 'span' ),
            height = innerText.offsetHeight - text[ text.length - 1 ].offsetHeight    innerText.style.top = height;
    </script>大概这样吧 滚动自己做一下