使用transform属性时遇到了一个问题。
我有一个简单的DIV填充屏幕，另一个DIV位于它上面。
我将以下转换应用于DIV：
'transform'：'rotateX（Xdeg）rotateY（Ydeg）'; 我也在使用preserve-3d
除Safari外，所有浏览器都能完美运行。根据我的阅读，Safari是唯一一个实际上正确的，并剪切了应用变换的顶级DIV。其他浏览器不会剪辑DIV。基本上，当DIV旋转时，它会进入底层DIV的内部/后面。
所以，我假设我需要使用translateZ来推动顶级DIV前进？
我的问题是，如何计算我需要沿Z轴向前翻译div，或者让它在Safari中运行？旋转X和Y将是变量，因此用户可能能够沿着X，Y，两者旋转元素或者根本不旋转元素。
对此的任何帮助都会很棒。谢谢！
答案 0 :(得分：0)
您的X和Y值是否总是正值？
在这种情况下，
transform-origin 0% 0%
应该做的伎俩（使旋转中心成为结果中较低的点）
如果没有，你只需要一点逻辑：
如果X角度为正，则x原点为0％，否则x原点为100％
如果Y角度为正，则y原点为0％，否则y原点为100％
然后，申请
transform-origin x-origin y-origin
答案 1 :(得分：0)
如果没有jsFiddle，我无法重现您的问题。您可以使用element.getBoundingClientRect()之类的函数。这将为您提供第二个转换div的当前坐标。如果将这些与第一个div的坐标进行比较，您应该找到所需的translateZ。你需要比较转换后的div的所有4个角。负DELTA表示该角与第一个div相交。