GreenSock - 在 Chrome 中无法点击动画链接之后

Question

有非常奇怪的行为，不仅在 Google Chrome 中有效，而且在 Firefox 中有效。 我有一个只有侧页（没有顶部和底部）的立方体 - 所以我有 4 页，我将它们左右旋转 90 度。

这是实时示例（所有内容都在页面中 - JS 库取自 CDN，CSS 是内联的，没有图像）： http://www.cloomo.com/problem

如何模拟错误：

• 开始 Google Chrome 并转到 http://www.cloomo.com/problem
• 转到第 3 页（绿色背景），您将看到该链接 "Back 2" 和 "Page 4" 不起作用，它们的文字甚至不能 用鼠标选择。
• 您可以点击 "Page 2" > "Page 3" 或 "Left" > "Left"
进入第 3 页

你能帮我把这些链接设为可点击吗？

CSS 样式或 GreeSock 库中是否有错误？我找不到它，因为没有任何报道。

另一个问题：

有没有办法让它更流畅？

Answer 1

你的问题不在 greensock 动画，它在立方体本身。

当您设置

.cube {
    -webkit-backface-visibility: hidden; 
    -moz-backface-visibility: hidden;
    backface-visibility: hidden; 
}

然后将立方体旋转180度，立方体本身就隐藏了。

最重要的是，第三个面旋转了 180 度，这使它成为正面并且可见...但是其中的锚点将不可点击（不知为何，Chrome当父项不可见时失去处理鼠标事件的能力），

如您所说，这是 Chromw 特有的问题，Firefox 可以正常处理。 （而且 IE 根本不处理背面可见性）

但是，在您的设计中，立方体不需要隐藏背面可见性，所以放弃它，一切都会好的。