Question

需要帮助，为什么我的scrolltop无法处理sample 我不知道为什么......使用代码一切正常。但更新css滚动顶部不起作用。:(我应该怎么做才能解决这个？是我的CSS风格导致的问题？我用过这个，但它不会在div的底部滚动..

$(document).ready(function() {
    alert('scroll must happen');
    $('#message_container').scrollTop($('#message_container')[0].scrollHeight);
    $('.topbox').html('just sample');
});

Answer 1

没有可见的滚动发生，因为您尝试滚动的元素没有溢出;它全都显示出来了。滚动条适用于<body>元素，而不是您尝试滚动的<div>。

如果你给#message_container一个高度，你可以使它工作。

#message_container {height:100px;}

或者，使用绝对定位技巧，例如this demo。（初始“撤消”CSS，我用它来保持代码简短。See MDN）

#container, #head, #body, #foot{
    position: absolute;
    top:0;left:0;right:0;bottom:0;
}
#head {
    bottom: initial;
    height:50px;
}
/* position so it get's your desired size*/
#body {
    top:50px;
    bottom:50px;
    overflow-y: scroll;
}
#foot {
    top: initial;
    height:50px;
}

Answer 2

你必须设置两件事：

div的溢出，
一些高度，甚至一个百分比（使其更灵活）。

如果您没有设置任何高度，div将会展开，然后没有任何内容可以滚动，在这种情况下，您获得的唯一滚动条是文档本身（正文）。

我在CSS中添加了一个高度和溢出属性，现在它按预期工作。

<强> jsFiddle

CSS补充道：

#message_container {
 overflow-y:auto;
 overflow-x:hidden;
 height:300px;
}

滚动到底部不起作用

2 个答案: