css z-index在webkit轉換後丟失translate3d

Question

我有兩個絕對定位的div元素重疊。兩者都通過css設置了z-index值。我使用translate3d webkit轉換將這些元素從屏幕上移開，然後回到屏幕上。變換之後，元素不再尊重它們的值z-index。

任何人都可以解釋一旦我對它們進行webkit轉換，div元素的z-index/stack-order會發生什麼？並解釋我可以做些什麼來保持div元素的堆棧順序？

以下是關於我如何進行轉換的更多信息。

變換之前，每個元素獲得通過CSS設置這兩個WebKit的過渡值（我使用jQuery做.css()函數調用：

element.css({ '-webkit-transition-duration': duration + 's' }); 
element.css({ '-webkit-transition-property': '-webkit-transform' }); 

元素，然後使用translate3d動畫-webkit-變換：

element.css({ '-webkit-transform': 'translate3d(' + hwDelta + 'px, 0, -1px)' }); 

順便說一句，我已經試過的translate3d第三個參數設置爲幾個不同的值，以試圖複製在三維空間中的堆疊順序，但沒有運氣

此外，iPhone/iPad和Android瀏覽器是我的目標瀏覽器，此代碼需要運行。兩者都支持webkit轉換。