javascript - CSS 3D 旋转，在不同的浏览器中摆弄

Question

我有一个很大的 fiddle 。 http://jsfiddle.net/pz5VJ/3/

它有一个函数，在调整窗口大小时调用以缩放不同的东西。这适用于所有浏览器。

function dim()

它还有一个旋转横幅的功能。

function dauerrotieren()

您可以设置横幅的数量，它会将它们放在下一个位置。我有 6 个可能的图片，因此您可以将 var anzahl_an_bannern 设置为 1 到 6 之间的数量。

整个过程在 Opera 和 Chrome 中运行良好。在 IE 中它不起作用。我假设 CSS 存在问题。

Firefox:基本上可以，但是旋转回到 0 度(第 42 行)是在移动而不是在 0 毫秒内。我希望它表示连续旋转，而不是 4x90 和曾经的 -360。

我不能让它只增加 90 度直到无穷大，因为如果你最小化浏览器并在一段时间后再次打开它，它会尽快完成所有那些错过的旋转以回到当前度数(3780 或无论当时身在何处)。

抱歉这篇文章太长了。如果它在代码中包含太多令人困惑的德语注释，我可以清理它以便更好地阅读，或者将其替换为英语。不过很快就有预约了，所以我明天就得去做。

Answer 1

在 IE 中，preserve-3D 还不工作，所以你得到的是平面而不是 3D 效果。 以下是来自 MSDN 的原文:

"注意 W3C 规范为此属性定义了一个关键字值 preserve-3d，表示不执行展平。此时，Internet Explorer 10 不支持 preserve-3d 关键字。您可以通过以下方式解决此问题除了子元素的正常变换之外，手动将父元素的变换应用于每个子元素。”

引用:http://msdn.microsoft.com/en-us/library/ie/hh673529%28v=vs.85%29.aspx