position:sticky失效原因分析
最近发现原来的1个项目,吸顶功能失效了,我的吸顶是利用了position:sticky
来实现的,后来把吸顶元素的父级元素的overflow:hidden
去除掉以后吸顶功能重新失效
sticky属性仅在以下几个条件都满足时有效:
- 父元素(注意这里的父元素特指参考滚动的那个父级元素,并不是代表这个元素的所有父元素)不能
overflow:hidden
或者overflow:auto
属性,或者body
设置了height:100%
- 必须指定top、bottom、left、right4个值之一,否则只会处于相对定位
- 父元素的高度不能低于sticky元素的高度