强制滚动条到底部

发布于 2024-11-29 17:49:20 字数 511 浏览 2 评论 0原文

我正在制作一个运行良好的小型消息/聊天系统。问题是,消息输出到的

没有按照我需要的方式滚动。

所有新消息都会添加到 div 的底部,当添加更多消息并显示滚动条时,滚动将停留在

的顶部。 我需要将其反转,以便滚动始终粘在
的底部。

我想要的一个很好的例子是 Steam 的聊天窗口,甚至是我用来填写问题的文本输入。

由于我想避免 jQuery,这让我完全陷入困境。如果您能指出我正确的方向,那就太好了!我不确定 HTMLCSS 是否可以处理这个问题,或者 JavaScript 是否有必要。

I am making a little messaging / chat system that is working nice and fine. The problem is, the <div> which the messages are outputted to does not scroll the way I need it to.

All the new messages are added to the bottom of the div and when more are added and the scrollbar shows up, the scrolling stays at the top of the <div>. I need this to be reversed, so that the scrolling always sticks to the bottom of the <div>.

A good example of what I want would be Steam's chat windows, or even this text input which I am using to fill out the question.

As I would like to avoid jQuery, this has me completely stuck. If you could point me in the correct direction that would be great! I am not sure if HTML and CSS can handle this, or if JavaScript is necessary at all.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

暮色兮凉城 2024-12-06 17:49:20

下面的 Javascript 代码应该将您的 div 滚动条保持在底部,就像您所描述的那样:

var objDiv = document.getElementById("divExample");
objDiv.scrollTop = objDiv.scrollHeight;

可以在下面的链接中找到此解决方案和更多信息:
<一href="http://web.archive.org/web/20080821211053/http://radio.javaranch.com/pascarello/2005/12/14/1134573598403.html ">http://web.archive.org/web/20080821211053/http://radio.javaranch.com/pascarello/2005/12/14/1134573598403.html

The Javascript code below should keep your div's scrollbar positioned at the bottom like you described:

var objDiv = document.getElementById("divExample");
objDiv.scrollTop = objDiv.scrollHeight;

This solution and more information can be found on the link below:
http://web.archive.org/web/20080821211053/http://radio.javaranch.com/pascarello/2005/12/14/1134573598403.html

怀里藏娇 2024-12-06 17:49:20

我认为这是一个更好的解决方案:

element.scrollTop = element.scrollHeight - element.clientHeight;

I think this is a better solution:

element.scrollTop = element.scrollHeight - element.clientHeight;
亢潮 2024-12-06 17:49:20

对于 Kotlin,我使用了以下内容:

val element = view?.findViewById<ScrollView>(R.id.uidScrollElement)
    element?.smoothScrollTo(0,element.measuredHeight)

For Kotlin I have used the following:

val element = view?.findViewById<ScrollView>(R.id.uidScrollElement)
    element?.smoothScrollTo(0,element.measuredHeight)
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文