如果高度更改,则滚动HTML div

时间:2012-01-27 13:39:14

标签: javascript html

如果另一个DIV的高度发生变化,使用JavaScript如何滚动HTML div?

在下面的代码中,如果mychat's高度发生变化,我需要chat DIV的滚动条应该会降下来。我的JavaScript错了,任何人都可以纠正它。

我的代码是

<style type="text/css">
        #chat
        {
            height:250px;
            width:200px;
            overflow:auto;
            background-color:Aqua;
            padding:5px;
        }
    </style>
    <script type="text/javascript">
        function show() {
            var MyDiv = document.getElementById('mychat');
            var MyDiv2 = document.getElementById('chat');
            var sval;
            if(MyDiv.clientHeight != sval)
            {
              MyDiv2.scrollTop = MyDiv2.scrollHeight;
            }
            sval = MyDiv.clientHeight;
        }
    </script>
    <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true">
</asp:ScriptManager>
<div id="chat">
<asp:Timer ID="Timer1" runat="server" Interval="200" ontick="Timer1_Tick">
</asp:Timer>

<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<ContentTemplate>
    <div id="mychat" runat="server">

    </div>
</ContentTemplate>
<Triggers>
    <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
</Triggers>
</asp:UpdatePanel>
</div>

对不起,我没有足够的知识来编写JavaScript。

2 个答案:

答案 0 :(得分:1)

这个小提琴似乎是你想要的 - 如果没有,它至少希望能引导你走向正确的方向。

http://jsfiddle.net/7uvzd/7/

改编自我用过的代码 How do I scroll a row of a table into view (element.scrollintoView) using jQuery?

答案 1 :(得分:0)

使用JavaScript,您正在寻找div的scrollTop属性。

scrollTop为0表示滚动条位于页面顶部。

尝试:myDiv.scrollTop = myDiv.clientHeight或类似的指标。