Question

标题说明了一切。我期待360视频或360图像作为我使用bootstrap开发的html5网站的背景。视频/图像应根据光标位置移动。我搜索了相当多的时间但找不到任何东西。如果有人知道任何我可以学习的来源，请告诉我。

Answer 1

您可以通过略微修改aframe.io来实现此目的。

<!DOCTYPE html>
<html>

  <head>
    <script src="https://rawgit.com/nleoutsa/auto-follow-aframe/master/dist/aframe-master.js"></script>
  </head>

  <body>
    <a-scene>
      <a-assets>
        <video id="paris" autoplay loop="true" src="http://s3.amazonaws.com/hapyak_demos/css360/videos/paris360.mp4">
      </a-assets>
      <a-videosphere src="#paris"></a-videosphere>
    </a-scene>
  </body>

</html>

Demo on JsBin

您可以使用“a-sky”或“a-videosphere”（aframe videosphere documentation）设置场景并启用外观控件（请参阅文档）。默认的Aframe行为将允许用户单击并拖动以旋转场景。

如果您分叉Aframe仓库并修改look-controls.js file，您可以按住光标而不按住鼠标。

如果你想看到diff：https://github.com/nleoutsa/auto-follow-aframe，我已经分叉了aframe并在这里进行了更改。这是一个非常小的变化。

希望这有帮助！ -Nick Leoutsakos

html5 bootstrap中的coursor交互式360视频/图像背景

1 个答案: