我准备了一个混合了 WebGL 和 CSS3D 的工作页面(在 SO here 的帮助下)，效果很好。我输入一个iframe为了更好地衡量:
但它缺乏与 iframe 交互的能力。
在 mrdoobs 中，纯 CSS3D demo人们甚至可以滚动页面并标记文本等:
看起来，WebGL 组合在 CSS3D 渲染器前面阻碍了交互。有办法解决这个问题吗？
谢谢， 德克
最佳答案
您可以apply CSS 指针事件:无指向 WebGL 节点，以便事件通过它到达底层 CSS3D 节点和 iframe。
您当前正在将 THREE.TrackballControls 附加到文档本身，因此不需要进行任何更改。
请注意，iframe 上的事件将直接分派(dispatch)到 iframe。父框架无法直接观察这些、捕获并转发它们或发送合成的。因此，当指针位于 iframe 上时，您会丢失导航控制事件。鼠标滚轮事件在 Google Chrome 中是一个异常(exception)。 ( fork WebKit)，但可能不会持续太久(2016 年 - 2 月)。为了保持流畅的导航控制，一种方法是在“未使用”时用(可能是灰色的)透明 div 覆盖 iframe。当您认为用户希望与 iframe 进行交互(无论是由于单击还是基于指针的轨迹)时，请移除此盖子。点击事件序列可以被拆分，父级捕获鼠标按下，然后将鼠标按下和点击事件留给 iframe - 但这是一个不完美的错觉，取决于 iframe 站点不关心看到鼠标按下。
关于javascript - Three.js - 将 WebGL 和 CSS3D 与 iFrame 混合，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35230163/