webkit轉(zhuǎn)換translate3d后css z-index丟失我有兩個(gè)絕對(duì)定位的div元素重疊。兩者都通過(guò)css設(shè)置了z-index值。我使用translate3dwebkit變換在屏幕上為這些元素設(shè)置動(dòng)畫,然后再返回到屏幕上。變換后,元素不再遵循其設(shè)定z-index值。任何人都可以解釋一旦我對(duì)它們進(jìn)行webkit轉(zhuǎn)換后,div元素的z-index / stack-order會(huì)發(fā)生什么?并解釋我可以做些什么來(lái)保持div元素的堆棧順序?以下是有關(guān)我如何進(jìn)行轉(zhuǎn)換的更多信息。在轉(zhuǎn)換之前,每個(gè)元素都通過(guò)css獲取這兩個(gè)webkit轉(zhuǎn)換值(我使用jQuery來(lái)執(zhí)行.css()函數(shù)調(diào)用:element.css({ '-webkit-transition-duration': duration + 's' });element.css({ '-webkit-transition-property': '-webkit-transform' });然后使用translate3d -webkit-transform對(duì)元素進(jìn)行動(dòng)畫處理:element.css({ '-webkit-transform': 'translate3d(' + hwDelta + 'px, 0, -1px)' });順便說(shuō)一句,我已經(jīng)嘗試將第三個(gè)參數(shù)設(shè)置translate3d為幾個(gè)不同的值,以嘗試在3d空間中復(fù)制堆棧順序,但沒(méi)有運(yùn)氣。此外,iPhone / iPad和Android瀏覽器是我的目標(biāo)瀏覽器,此代碼需要運(yùn)行。兩者都支持webkit轉(zhuǎn)換。
webkit轉(zhuǎn)換translate3d后css z-index丟失
慕無(wú)忌1623718
2019-08-12 16:18:31