gpt4 book ai didi

css - 不同高度的绝对定位

转载 作者:行者123 更新时间:2023-11-28 18:15:53 26 4
gpt4 key购买 nike

我有一个固定在窗口左边缘的侧边栏,并且有一些滚动内容与窗口底部对齐。通常,我可以将滚动内容的容器 top 属性设置为其上方内容的高度,一切看起来都正常。

这是我正在谈论的例子。还有一个more concrete example

#sidebar {
position: absolute;
top: 0;
bottom: 0;
left: 0;
}

/* and inside sidebar */
#header {
/* my question is, how do I achieve this effect when this height is 'auto' */
height: 100px;
}

#scrollable-content {
top: 100px;
overflow-y: scroll;
}

当滚动内容上方的内容没有固定高度时,是否可以实现同样的效果?我需要引入 JavaScript 吗?我该如何解决 this fiddle这样我总能看到滚动内容的底部?

最佳答案

您可以添加几行 javascript(使用 jQuery)来查找可滚动区域的高度:

// find the scrollable height
var scroll_height = $(window).height() - $('#header').height();

// set the height of the scrollable div
$('#scrollable-container').css('height', scroll_height + 'px');

然后在隐藏/显示后的点击函数中执行相同的操作,以便使用新的标题高度

http://jsfiddle.net/94E4Z/2/

关于css - 不同高度的绝对定位,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17915686/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com