position: fixed因为上层有transform导致失效解决方式


遇到得问题:

左右滑动切换子tab页面,用了uniapp得swiper,导致组件页面里定义得position: fixed失效(变成了绝对定位得效果)

 

解决方式:

// 一开始我打算重写swiper用margin-left代替transform完成这个效果

 

 发现了更多得问题:各个组件页面有很多地方定义了z-index和position:fixed导致渲染得效果很乱

 

最终解决方式:

我发现transform对于 position: sticky;吸顶这个属性还是会保留视口偏移得特性(并且又保留了相对得效果,总体就是我想要得效果)

 

 

 

 position: fixed 改成 positionsticky,即可解决上层有transform导致失效得问题。

注意:

1. positionsticky好像不能设置right(我设置了没效果),我改为了left

2. positionsticky的兼容性,没有fixed好。

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM