`

div滚动条自动根据其内容的增多往下滚动

 
阅读更多

 请教大家一个问题， div滚动条如何自动根据其内容的增多自动往下滚动？

比如说：一个div <div style="height:100px;overflow:auto;"></div> ， 我不停的往里面增加内容，div 就会出现滚动条，
现在我想让 div 的滚动条跟着一起往下滚动，该如何实现？？

QUOTE:
以下都是默认自动滚动到底部，需要滚动到顶部只需将document.body.scrollHeight换为0.

方法一：用scroll方法实现。

<body onload="document.body.scroll(0,document.body.scrollHeight) ">
<script>
document.write(new Array(100).join("<br>"))
</script>

方法二：用scrollBy方法实现。

<body onload="document.body.scrollBy(0,document.body.scrollHeight) ">
<script>
document.write(new Array(100).join("<br>"))
</script>

方法三：用scrollTo方法实现。

<body onload="document.body.scrollTo(0,document.body.scrollHeight)">
<script>
document.write(new Array(100).join("<br>"))
</script>

方法四：用赋值方法实现。

<body onload="document.body.scrollTop=document.body.scrollHeight">
<script>
document.write(new Array(100).join("<br>"))
</script>
分享到：
| jquery键盘事件
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    DIV动态显示滚动条

    例如，当`DIV`内容增多时，可以减小其宽度或高度，从而触发滚动条： ```javascript $("#scrollDiv").width(250); // 减小宽度，可能会显示滚动条 $("#scrollDiv").height(150); // 减小高度，可能会显示滚动条 ``` ...

    jsp中为表格添加水平滚动条的实现方法

    首先，本项目中使用的是bootstrap框架，因此有些人会说，给表格设置自适应属性就可以了 ...这里，解决的方法很简单，设置标签的属性即可，让其不要自动换行 $(document).ready(function() { $(th).css(white-space,

    jsp中为表格添加水平滚动条的方法

    这种方法简单且有效，可以确保在浏览器最大化时，即便表格列数增多，也能通过水平滚动条查看完整内容。 需要注意的是，这种方法主要解决了`&lt;th&gt;`标签中的内容不换行的问题。若需让整个表格显示水平滚动条，还需要...

    DivCss 问题

    `overflow`属性可以设置如何处理溢出的内容，例如设置为`auto`可以添加滚动条，`hidden`则会隐藏超出的部分。 3. **弹性盒模型（Flexbox）**：现代CSS布局中，使用Flexbox可以让容器自动调整子元素的大小，以适应...

    相邻div实现一个跟着另一个自适应高度示例代码

    当任一侧的`div`内容增多时，其`padding-bottom`所创建的虚拟高度会随之增长，但由于`margin-bottom`是负值，所以不会影响整个容器的高度。由于两个`div`都浮动在同一行，它们会自动调整高度以保持相同高度。 这种...

    前台框架API和示例

    - `overflow`: 滚动条显示方式，可选值为`auto`（内容超出容器高度时显示滚动条）、`hidden`（始终不显示滚动条），默认值为`visible`。 - `position`: 容器的水平位置，默认为`left`，可设置为`center`使其居中...

    JS实现页面数据懒加载

    代码示例中提到，当目标DIV距离可视区域顶部的距离a，大于等于滚动条的垂直位置且小于等于滚动条垂直位置加上视窗高度时，说明DIV已经进入可视区域。此时，触发数据加载函数loadingFunction()。 知识点五：其他方法...

    网页表格冻结示例，jquery实现

    然后，我们在窗口的滚动事件中检查滚动条的位置，当滚动超过表头的高度时，添加`.fixed`类来使冻结的表头固定在顶部。 为了美化冻结部分，我们还需要在CSS中定义`.freezeHeader`和`.fixed`类的样式： ```css ....

    易语言程序免安装版下载

    修改扩展界面支持库一，禁止透明标签在父窗口刷新时自动刷新，以解决其导致窗口刷新缓冲的问题。 8. 改进应用接口支持库中“设置屏幕分辨率”命令。 9. 修改外部数据库在“表中记录数为零”时可能导致程序崩溃的...

Magicbox
Global site tag (gtag.js) - Google Analytics