Z-Index在Chrome和Safari中表现不同

Question

我一直在制作3D作品http://jsbin.com/vihoye/3/edit?html,output

除了我最后的障碍外，它是完美的。出于某种原因，Z-index在Chrome和Safari中的表现不同。这里有两件事情出错，但都是定位问题。

问题＃1

太阳能系统由右下方的菜单控制。当你点击说＆＃34;生活技能＆＃34;信息对话突然出现在这个星球上。在FireFox中，当您将鼠标悬停在对话框上时，它会触发弹出窗口。但是在Chrome和Safari中，我无法触发鼠标悬停事件。

问题＃2

在FireFox中，一旦触发鼠标悬停事件，弹出窗口就会出现在太阳能系统顶部。但是，在Chrome和Safari中，行星会通过弹出窗口旋转。

我无法弄清楚它是否是位置属性，或者是否是导致问题的rotateY。

有什么建议吗？在此先感谢您的帮助。

Answer 1

好的，这是我的解决方案DEMO JS Bin。它在Chrome中完美运行，但在Safari中，行星仍然通过弹出窗口旋转。更多的调试，它可以修复，但它不是一个异常的坏。

我刚刚更改了这个CSS ID：

#galaxy {
    position: fixed;
    width: 100%;
    height: 100%;
    perspective: 4000;
    -webkit-perspective; 4000;
}