请问,我如何记录滚动条位置,就像qq一样,如果滚动条在最下面,有新信息滚动条跟着向下

请问,我如何记录滚动条位置,如果滚动条在最下面,有新信息滚动条跟着向下,如果不在最下面,即使有新信息,
滚动条也不跟着向下.
就像qq显示的一样,我用cookie记录了滚动条位置,貌似不对.
不能实现qq的这种效果
请高手指点

解决方案 »

  1.   


    function getScroll()  
    { 
        var t, l, w, h; 
         
        if (document.documentElement && document.documentElement.scrollTop) { 
            t = document.documentElement.scrollTop; 
            l = document.documentElement.scrollLeft; 
            w = document.documentElement.scrollWidth; 
            h = document.documentElement.scrollHeight; 
        } else if (document.body) { 
            t = document.body.scrollTop; 
            l = document.body.scrollLeft; 
            w = document.body.scrollWidth; 
            h = document.body.scrollHeight; 
        } 
        return { t: t, l: l, w: w, h: h }; 
    } 
     
    </script> 这样就得到位置了，你可以根据位置来判断滚动条的状态，也可以js设置
      

  2.   

    我把这代码放到我的文件里,t和l始终都是0,w和h都是固定值
      

  3.   

    设置滚动偏移 xxx是textarea的ID
    document.getElementById('XXX').scrollTop = document.getElementById('XXX').scrollHeight要滚动到原来位置就记录下 document.getElementById('XXX').scrollTop的值 在赋予就可以了
      

  4.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <title>new document</title>
    <style type="text/css">
    html, body{
    margin:0; padding:0; font-size:12px;
    }
    #msg{
    border:1px solid #006699; overflow:scroll;
    width:500px; height:100px;
    }
    #msg div{
    line-height:20px;
    }
    </style>
    <script type="text/javascript">
    window.onload = function(){
    var msg = document.getElementById("msg");
    var autoScroll = true, height = msg.offsetHeight, lh = 20;
    (function(){
    autoScroll = (msg.scrollHeight - msg.scrollTop - height + lh) < 5 ? true : false;
    msg.innerHTML += "<div>" + new Date().toLocaleString() + "</div>";
    if(autoScroll){
    msg.scrollTop = msg.scrollHeight - height + lh;
    }
    setTimeout(arguments.callee, 1000);
    })();
    };
    </script>
    </head>
    <body>
    <div id="msg"></div>
    </body>
    </html>
      

  5.   

    上面的代码如果div是100%,就会出问题
    滚动条始终在最上面
      

  6.   

    <HTML>
    <HEAD>
    <base target=_blank>
    <TITLE> chat </TITLE>
    <meta http-equiv="expires" content="0"><!-- no cache begin -->
    <meta http-equiv="Cache-Control" CONTENT="no-cache">  
    <meta http-equiv="Pragma" CONTENT="no-cache">  <!-- no cache end -->
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"><!-- 导入前端系统库 -->
    <link href="/commonjs/css/7wx.css" type="text/css" rel="stylesheet">
    <SCRIPT src="/commonjs/7wx.js"></SCRIPT>
    <SCRIPT src="prototype-1.6.0.2.js"></SCRIPT>
    <script type="text/javascript" charset="utf-8" src="kindeditor-3.4.2/kindeditor.js"></script>
    <script type="text/javascript">
        KE.show({
            id : 'content',
            beforeCreate : function() {
     },
    afterCreate : function() {//注册快捷提交事件
    var o = KE.g['content'].iframeDoc;
    KE.event.ctrl(o,'\r',tosubmit); 

    }
        });
    </script>
    <style type="text/css">
    .colorClass{color:red;font-size:12px;}
    .colorClass1{color:blue; }
    .colorClass2{color:#8C7301; }
    .colorClass3{color:green; }
    .colorClass4{color:#8F0197; }
    .colorClass5{color:#0084A0; }
    .colorClass6{color:red; }
    div{line-height:20px;
    font-size:14px;
    }
    </style>
    </HEAD><!-- =============== HTML area =======================--><BODY onload="loadok();">

    <table  class=layout cellpadding=0 cellspacing=0 width=100% >
    <tr style="height:22px;background-image: url(../images/caidan1.jpg);" onDblClick="showOrHidden()">
    <td>
    <b>&nbsp;&nbsp;总部投顾解盘</b>
    </td>
    <td align=right>
    <a onclick="isOrNotFresh()" style="cursor:hand;color:#000000;text-decoration:underline;"><span id="freshSpan">锁屏</span></a>&nbsp;&nbsp;
    <a onclick="showOrHidden()" style="cursor:hand;color:#000000;text-decoration:underline;"><span id="showHidden">全屏&nbsp;&nbsp;</span></a> </td>
    </tr>
    <!-- B.业务数据区：列表 -->
    <tr><td colspan=2>
    <div id="chatSide" style="height:100%;width:100%;overflow:auto;background-color:#f1f2f3;border:1px inset white;BORDER-BOTTOM: 2px inset red;">
    <div id="chatDiv" style="padding:3px;background-color:#f1f2f3;width:100%;border:0px inset white;overflow:hidden; ">
    <table id="chatTb">
    </table>
    </div>
    <div id="chatEND" style="height:0px; overflow:hidden"></div>
    </div>
    </td></tr>
    <tr style="height:60px;" id="sendTR">
    <td colspan=2>
    <form name="onlineform" >
    <table width=100%>
    <input name="content_type" type="radio" value='观点' checked="true"> 观点 
    <input name="content_type" type="radio" value="荐股">荐股
    <input name="content_type" type="radio" value="资讯">资讯
    <input name="content_type" type="radio" value="市场描述">市场描述
    <input name="content_type" type="radio" value="产品">产品
    <tr><td>
    <textarea name="content" cols=52 rows=10 style="overflow:auto" >　</textarea>
    </td></tr>
    <tr><td align=left>
    <button name="sendbutton"  onclick="sendOnlineInfo()">发送</button>(快捷键:ctrl+ENTER)
    </td></tr>
    </table>
    </form>　
    </td>
    </tr>
    <tr style="height:10px;" ><td><a onclick="allChat()"style="cursor:hand;color:#000000;text-decoration:underline;">查看所有记录</a>&nbsp;
    </td></tr>
    <tr style="display:none;" ><td><input type='button' id="soundBtn" onClick="playHome();" ><bgsound id='sound'>
    </td></tr>
    </table>
    </BODY><!-- =============== Script area =======================--><SCRIPT LANGUAGE="JavaScript">
    <!--
    ////////////////=====界面初始化=========var o_id="-1";
    var isXuser=false;
    var userRoles="";
    var freshSign=true;
    var content_typeVar="";
    function check(){
    if(freshSign){
    var url = "/servlet/com.csc.ic.ICSystem?action_=getOnlineinfos_new&o_id="+o_id;
      new Ajax.Request(url, {onSuccess: function(transport) {    
     // alert(transport.responseText);  
    eval(transport.responseText);
      chatDiv.innerHTML=chatDiv.innerHTML+divContent ;
       
    o_id=maxid;
      
      } });     
    }  
    }function sendOnlineInfo(){

    var c=KE.util.getData('content');
    c=c.replace(new RegExp("'","g"),'"');
    var p=KE.util.getPureData('content');
    p=p.replace(new RegExp("'","g"),'"');
    if(Xtrim(c)==""){
    alert("请输入发言内容!");
    return;
    }
    if(Xtrim(p).length>2000){
    alert("请输入2000字以内");
    return;
    }
    getContent_type();
     var url = "/servlet/com.csc.ic.ICSystem?action_=addOnlineinfo";
     
      new Ajax.Request(url,
      {
      method:
      'post',parameters:{'content':c,'o_id':o_id,'content_type':content_typeVar,'content_pure':p,'ran':Math.random()}, 
      onSuccess: function(transport) {
      eval(transport.responseText);
        chatDiv.innerHTML=chatDiv.innerHTML+divContent;   
      o_id=maxid;

      }
     });

    clearEditor('content');
    setTimeout('chatEND.scrollIntoView()',1000);
    }setInterval("check()",10000); 
    function clearEditor(id) {    
    KE.util.setFullHtml("content", '');
    }function loadok(){
    callServer("com.csc.ic.ICSystem","getUserRoles",XgetFormDicsURL(onlineform));  
    }
    function getContent_type(){
    var arrs=onlineform.content_type;
    for(var i=0;i<arrs.length;i++){
    if(arrs[i].checked==true){
    content_typeVar=arrs[i].value;
    }
    }
    }
    function on_getUserRoles(){
    isXuser=buffer.isXuser;
    userRoles=buffer.userRoles;
    if(isXuser||userRoles.indexOf(",1,")>-1||userRoles.indexOf(",2,")>-1){
    document.getElementById("sendTR").style.display="";
    }else{
    document.getElementById("sendTR").style.display="none";
    }
    check();
    setTimeout('chatEND.scrollIntoView()',1000);
    }
    function logonOK(){document.location = document.location;}function allOnline(){
    Xdialog("onlineinfos.html");
    }function tosubmit(evt)//
    {
    evt = evt||window.event;
    sendOnlineInfo();
    evt.returnValue=false;
    }//-->
    </SCRIPT>
    </HTML>
      

  7.   

    大概看了一下，我觉得应该是让chatDiv来滚动，而不是整个页面.Ajax返回的数据是什么样的？