微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

A型框框是一个链接

如何解决A型框框是一个链接

我想知道如何在 A-frame (aframe.io) 中将一个框变成一个链接我有链接结构和盒子结构,但我希望盒子变成一个链接。关于如何实现这一目标的任何想法?

解决方法

a-framelink 组件使用 window.location 更改网站,您可以在自定义组件中执行相同操作:

<script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
<script>
  // component declaration
  AFRAME.registerComponent("mylink",{
    // define a url in the schema
    schema: {
      href: {}
    },init: function() {
      // when clicked - change the location:
      this.el.addEventListener("click",(e) => {
        window.location = this.data.href;
      })
    }
  })
</script>

<a-scene cursor="rayOrigin: mouse">
  <a-box position="0 1 -2" color="blue" mylink="href: https://aframe.io/;"></a-box>
</a-scene>


如果您愿意,您还可以抓住锚点 (a) 元素并执行 `anchorElement.click();` 而不是更改 `window.location`。 ,

我有一个网站,可以用二十面体链接到网站的其他部分 (忽略荒谬的组件数量,我是从站点代码复制粘贴的)

<script src="https://aframe.io/releases/1.0.3/aframe.min.js"></script>
    <script src="https://unpkg.com/aframe-text-geometry-component@0.5.1/dist/aframe-text-geometry-component.min.js"></script>
    <script src="https://unpkg.com/aframe-event-set-component@^4.0.0/dist/aframe-event-set-component.min.js"></script>
    <script src="https://unpkg.com/aframe-debug-cursor-component/dist/aframe-debug-cursor-component.min.js"></script>
    <script src="https://cdn.rawgit.com/donmccurdy/aframe-physics-system/v4.0.1/dist/aframe-physics-system.min.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/donmccurdy/aframe-extras@v6.1.1/dist/aframe-extras.min.js"></script>

<a-scene>
<a-entity
          link="href: personal.html; title: Personal Projects"
          geometry="primitive: icosahedron; depth: 0.5; height: 0.5; width: 0.5; skipCache: false; segmentsHeight: 1; segmentsWidth: 1; segmentsDepth: 1"
          material="color: #ff6600"
          animation__mouseenter="property: components.material.material.color; type: color; to: blue; startEvents: mouseenter; dur: 500"
          animation__mouseleave="property: components.material.material.color; type: color; to: #ff6600; startEvents: mouseleave; dur: 500"
        ></a-entity>
</a-scene>

这是 A-Frame 1.0.3,所以我不确定它是否适用于新版本。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。