Question

我有很多标签，当点击任何标签时，会显示垂直滚动div。喜欢facebook的消息页面：点击任意用户的名字。对话似乎并且滚动条默认位于div的底部。

这是标签：

<ul class="companies">
    @foreach (var item in Model)
    {
       <li id='company_@(item.Id)' data-id='@item.Id' >
           <a>@item.Name</a>
       </li>
    }
</ul>

内容：

@foreach (var item in Model)
{
   <div id="scrollingDiv"  class="scrollingDiv"> @item.News </div>
}

和CSS：

.scrollingDiv {
    overflow-x: hidden;
    max-height: 500px;
    overflow-y: scroll;
}

点击任意标签时，我想在底部保留滚动条。（总是看到最新消息）。也是当前的div。我检查了this个问题。但在我的申请中没有用。我该如何解决这个问题？

Answer 1

使用JavaScript，您可以执行类似

的操作

var d = document.getElementById('myDiv');

if(d.scrollHeight > d.clientHeight) {
  d.scrollTop = d.scrollHeight - d.clientHeight;
}

每次向div添加内容或希望可滚动容器滚动到底部时执行此逻辑。

Answer 2

jQuery的scrollTop()函数可能正是您所需要的。见http://api.jquery.com/scrollTop/

Answer 3

您可以使用以下代码来实现

$('.full-area').scrollTop($('.full-area')[0].scrollHeight);

如何在div中保持滚动条在底部？

3 个答案: