相对固定位置),html如果没有找到则默认为元素。换句话说,您的绝对定位元素将在屏幕上与您预期的不同。如果你正在建设一些旧的浏览器,有人可能会认为这种情况的解决方法就是相对定位和粘性定位都设置:
.footerwithAbsolutePositionedeChildren{
position: relative;/*don't forgot this*/
}
/*NOTE: @supports has to be at the root,not nested*/
@supports(position:sticky){
.footerwithAbsolutePositionedeChildren{
position: sticky;
bottom: 20px;/now this won't mess with position in non-sticky browsers*/
}
}
利用JS你绝对可以实现这个。但这将涉及一个scroll事件监听器,这仍然是一个非常昂贵的东西添加到您的应用程序。滚动是用户执行的最常见操作之一,并且在这些事件期间执行JavaScript使得难以维持稳定的60 FPS(每秒帧数)滚动。UI与用户的鼠标/手指/手写笔不同步。这称为滚动jank。有一种特殊的事件监听器称为被动事件监听器,它让浏览器知道您的事件不会停止滚动,因此浏览器可以更好地优化这些事件。但是在IE或Edge中它们还不支持,无论如何你都需要JS后备方法。
此外,由于position:sticky您在滚动期间没有写入DOM,因此您不会导致任何强制布局和布局重新计算。因此,浏览器能够将此操作移动到GPU,即使粘性元素在播放中,您也可以非常流畅地滚动。它在移动Sarari中特别流畅。