`

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 div滚动条样式

    `：内容超出 DIV 区域时，将自动添加滚动条。 DIV 滚动条的样式设置 在设置 DIV 滚动条的样式时，我们可以使用以下属性： * `border-style`：设置 DIV 元素的边框样式。 * `border-width`：设置 DIV 元素的边框...

    div滚动条优化

    "div滚动条优化"这个主题主要关注如何在不牺牲滚动功能的前提下，通过CSS样式和JavaScript技术来美化或定制滚动条，使其更加符合现代网页的审美标准和用户体验需求。 首先，我们要了解默认滚动条的样式通常是浏览器...

    div内容自动滚动,自动生成随机颜色

    当`div`内的内容过多，超出其可视区域时，我们可以实现内容自动滚动效果。这通常通过JavaScript或者CSS实现。使用JavaScript，可以监听内容的变化，然后调整`div`的高度使其始终保持滚动到底部。例如，以下是一个...

    jQuery实现将div的滚动条滚动到指定位置

    2. **滚动条**: 当div的内容超出其宽度或高度时，浏览器会自动显示滚动条，以便用户查看隐藏的内容。 3. **jQuery**: jQuery是JavaScript的一个库，提供了丰富的API，简化了JavaScript编程，如选择器、事件处理、...

    JS控制滚动条自动向下滚动

    在JavaScript（JS）编程中，控制滚动条自动向下滚动是一种常见的需求，特别是在实时聊天、论坛或者日志更新等场景中，我们希望用户能够始终保持看到最新的内容。本篇将详细讲解如何利用JavaScript实现这一功能，以及...

    网页局部div随滚动条置顶滚动

    网页局部div随滚动条置顶滚动是一种常见的网页交互设计，常用于新闻网站、电商页面或者任何需要突出显示特定内容的场景。这种效果使得用户在滚动页面时，某个div元素（通常包含重要信息或导航）始终保持在视口顶部，...

    Android手机版浏览器DIV滚动条失效解决方案

    在Android平台上，开发一款手机版浏览器时，可能会遇到一个常见的问题：在特定情况下，网页中的`div`元素的滚动条无法正常工作。这个问题通常是由于Android原生浏览器或自定义WebView组件的某些特性引起的。本文将...

    让div滚动条初始化到最低位置的三种方法

    在前端开发中，有时我们需要实现一个功能，即在向某个特定的`div`容器内添加新内容后，使该`div`的滚动条自动滚动到最底部，以确保新添加的内容能够立即呈现在用户的视线范围内。本文将详细介绍三种实现这一目标的...

    div滚动条样式一览-div+css设计网

    而当这些`div`元素中的内容超出其设定的宽度或高度时，滚动条就会出现，以帮助用户浏览不可见的部分。在本文中，我们将深入探讨如何使用CSS来定制`div`元素的滚动条样式，以提升网页的视觉效果和用户体验。 一、...

    div随滚动条上下滚动

    这段代码会计算`myDiv`相对于视口顶部的距离，并根据滚动条位置调整其`top`样式。 4. **性能优化** 高频率的滚动事件可能会导致性能问题，为此，我们可以使用`requestAnimationFrame`或`throttle/debounce`函数...

    jqueryDIV滚动条

    jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jquery滚动条jsDIV滚动条jsDIV滚动条jsDIV滚动条

    DIV滚动悬浮层(滚动条动，层不动)

    通过这种方式，当页面滚动时，悬浮层会根据我们的需求进行动态调整，实现"滚动条动，层不动"的效果。 当然，实际的项目可能会更复杂，比如要考虑不同设备的响应式布局，或者添加动画效果等。但以上基础步骤已经涵盖...

    滚动条，div滚动条，图层下拉条

    滚动条在网页设计中起着至关重要的作用，它允许用户在内容超过屏幕显示范围时浏览页面的其余部分。本项目专注于“滚动条”的定制化，特别是针对`div`元素和图层下拉条的特效。通过自定义滚动条的样式和功能，可以...

    纯css实现table滚动条(纯css实现div滚动条)

    纯css实现table滚动条(纯css实现div滚动条),主要是通过设定高度/宽度及overflow:auto;实现.

    页面出现滚动条的时候如何让滚动条不影响页面宽度

    在网页设计中，当页面内容超出了可视区域的宽度时，浏览器会自动添加水平滚动条以允许用户水平滚动查看隐藏的内容。然而，滚动条本身会占用一定的空间，这可能会导致页面宽度缩小，从而影响布局的整体美观性。为了不...

    一款好看的DIV+CSS滚动条

    总的来说，自定义DIV+CSS滚动条是一项增强网页界面体验的技术，它允许开发者根据自己的设计需求，轻松调整滚动条的外观和交互。通过学习和实践，初学者也能掌握这一技巧，为他们的网页添加更多个性化和专业化的元素...

    利用div+jquery自定义滚动条

    updateOnContentResize: true // 当内容改变时自动更新滚动条 } }); }); ``` 通过以上代码，我们可以创建具有特定样式和行为的滚动条。更进一步，我们可以使用CSS来定义滚动条的各个部分，如轨道、滑块、箭头等...

    使用div做滚动条

    所谓DIV滚动条，是指在一个固定宽度和高度的`&lt;div&gt;`元素内部添加垂直或水平滚动条，以便于显示超出该区域的内容。这种方法非常适合于在网页上展示大量文本、图片或列表等信息时使用，能够在不增加页面整体尺寸的情况...

    jQuery+mousescroll.js自定义美化div滚动条插件

    在网页设计中，用户体验是至关重要的，而滚动条作为页面浏览不可或缺的一部分，其美观与功能性的结合能够提升网站的整体质感。"jQuery+mousescroll.js自定义美化div滚动条插件"就是这样一个工具，它旨在将传统的...

    DIV动态显示滚动条

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

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