css transform:translateZ 导致z-index无效

Question

我在使用一个下拉刷新,无限滚动的Vue组件,这个组件在标签里生成了

transform: translate(0px, 0px) scale(1) translateZ(0px);

因为这个属性,导致组件里包含的标签无法改变z-index属性.

请问有什么解决方法吗?

这是我要实现的效果,我在Chrome devtool取消了transform属性之后的实现

Answer 1

参见这个：
https://stackoverflow.com/que...
https://segmentfault.com/q/10...

由于z-index和transform用的是两个不同的层结构，使用transform的时候，z-index由于无法定位在z-index坐标系上的位置，所以会失效，可以试着用绝对定位替换transform。