苏飞论坛

标题: 【前端丨学习笔记】实现滚动条一直在最底部 [打印本页]
作者: Amy    时间: 2018-12-21 16:08
标题: 【前端丨学习笔记】实现滚动条一直在最底部
【前端丨学习笔记】实现滚动条一直在最底部

【零基础学习web前端】教程目录导航
http://www.sufeinet.com/thread-24027-1-1.html


有时候我们在展示一些实时数据展示并且数据量很大的时候，我们需要将滚动条至于底部，
或者是在做聊天对话框的时候，需要每次打开聊天窗口时，滚动条都处于最底部。
$('#content').scrollTop( $('#content')[0].scrollHeight)
例如
[HTML] 纯文本查看 复制代码
<div id="content">

        实现滚动条一直在最底部,实现滚动条一直在最底部,实现滚动条一直在最底部,实现滚动条一直在最底部,实现滚动条一直在最底部,实现滚动条一直在最底部,

        实现滚动条一直在最底部,实现滚动条一直在最底部,,实现滚动条一直在最底部,实现滚动条一直在最底部,

    </div>

    <script type="text/javascript" src="jquery.js"></script>

    <script>

    $(function(){

        $('#content').scrollTop( $('#content')[0].scrollHeight )

    });   

[CSS] 纯文本查看 复制代码
#content{

        width: 200px;

        height: 200px;

        background: #e5e5e5;

        overflow: auto;

    }

overflow设置滚动条   js打开定位到最下方,效果图：
(, 下载次数: 103)