我在我的项目中使用css 3d变换.我试图在几个其他元素的包含元素上应用新的转换.我也试图在其子元素之一上使用getBoundingClientRect.该容器中还包含其他元素.当容器具有transformcss属性的此值时:
translateZ(1026px) rotateX(-90deg) rotateY(180deg) translateZ(439.001px)
这element.getBoundingClientRect().top是某个子元素的含义:77.953109741210944根据chrome的开发人员工具,但是当我使用elementstab将`transform属性更改为:
translateZ(1027px) rotateX(-90deg) rotateY(180deg) translateZ(439.001px)
这是什么element.getBoundingClientRect().top:-75048.6484375可能导致这种情况的原因是什么？我没有发布任何代码,因为即使我通过控制台修改了值,也会发生这种情况.当我制作第translateZ一个类似于1000px的东西时,它仍然是大约77.即使它在0时,边界矩形的顶部在某处约为50-100.但是当它超过1026px时,这个元素似乎会跳到-80000左右.然而,在视觉上,元素看起来应该是并且不会在1027px处随机"跳跃".有人会说可能导致这种情况吗？
如果它是浏览器错误或其他什么,我使用chrome 32.0.1687.2 dev-m Aura
编辑:
这是一个jsfiddle链接:
它将生成一个包含所有translateZ值和结果elt.getBoundingClientRect().top值的表.代码很乱,但是在输出的表格中,如果仔细查看它,你会发现,在某些时候,最高值会随机跳远,远远低于.然后它会很快恢复到恢复之前的价值.奇怪的.
小提琴可能需要很长时间才能加载.