在具有固定位置的元素上隐藏溢出

Question

有没有办法用容器隐藏固定 div的溢出？我认为修复固定会做到这一点，但似乎并非如此。我能想到的唯一解决方法是“倒置”掩码：其他固定的div隐藏周围的所有，但如果有任何其他解决方案，它会更好。

这是小提琴：http://jsfiddle.net/pjFa6/1/

Answer 1

不幸的是，似乎不可能将固定元素嵌套在另一个元素（固定或不固定）中，并期望外部元素将其包装并隐藏任何溢出。

我唯一能想到的是将内部div设置为position:absolute而不是固定。以下是基于您的jsfiddle的示例：jsfiddle.net/pjFa6/15。

Answer 2

在某些移动浏览器环境中，使用-webkit-overflow-scrolling: touch可能会实现“剪裁”＃34;固定位置元素。请参阅：https://miketaylr.com/posts/2015/06/position-fixed-overflow-hidden.html

Answer 3

在容器中使用z-index: any value;语句的

将在某些webkit浏览器中执行，例如chrome。