2

我有一个包含大量文本的容器,但我希望容器保持固定。容器不包含所有文本,我想要滚动将从底部溢出的文本移动到固定 div 中,而 div 顶部的文本从顶部溢出并隐藏。

本质上,我希望容器是固定的,但窗口滚动条要考虑文本的总长度,而不仅仅是固定容器的高度。

#text-container {
   position: fixed;
   height: 300px;
   width: 400px;
   background: cyan;
}

http://jsfiddle.net/YEz5h/

我不一定需要任何直接的解决方案,但希望指出正确的方向。我不想要任何溢出的滚动条。我希望主窗口滚动条能够控制文本移动到视图中。

4

3 回答 3

3

它可以用一点 jQuery 来完成。我将内部附加div#text-container具有相对位置的位置。然后我监听窗口何时滚动并将bottomcss位置更新为与scrollTop

$('#text-container').wrapInner('<div></div>');
$(window).on('scroll', function(){
    $('#text-container > div').css('bottom', $(window).scrollTop());
});

http://jsfiddle.net/YEz5h/3/

于 2013-09-20T05:18:41.867 回答
0

检查 JS 小提琴

http://jsfiddle.net/YEz5h/2/

#text-container {
    position: fixed;
    max-height: 300px;
    width: 400px;
    background: cyan;
    overflow-y:scroll;
}
于 2013-09-20T04:27:33.160 回答
0

你可以使用这个代码

overflow-y:auto;
overflow-x:hidden;
于 2013-09-20T05:13:09.633 回答