开发微站时发现一个bug,在小米1s的微信webview里面,当元素被设为position:fixed时,z-index有时候会失效。

测试了一下,发现是因为有些元素使用了-webkit-animation。

这是怎么一回事呢?当两个元素都设为position:fixed时,再给他们设z-index,这时,层级就不是按照正常的大者为上了。

而是先看看谁有-webkit-animation这个属性,哪个有就哪个为上。如果两个都有,这是才以正常层级划分。

先别急,除了是否有-webkit-animation这个属性之外,里面必须有渐变属性

@-webkit-keyframes name{
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(0deg); }
}

像上面的代码,虽然从0%-100%都没有变化,可是却不能省掉,不然就当做没有-webkit-animation属性一样,沉下去了。

© 2012 Hedgehog Suffusion theme by Sayontan Sinha