如何在框架中创建链接？ [英] How do you create links in a-frame?
本文介绍了如何在框架中创建链接？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我试图将这些弯曲的图像以a型框架链接到其他HTML页面，这些页面是：
大厅。 html
clock.html
titanic.html
我已经在网上对其进行了研究，但找不到答案，因此，如果有人对a框架有任何经验，将不胜感激。
基本上，我要做的是，当某人查看a帧中的一个弯曲图像时，会将其带到HTML页面。
谢谢
<！DOCTYPE html> < html> < head> < meta charset = utf-8> < title> 360Belfast< / title> <元名称=说明 content =弯曲的图像-A框架> < script src = https://cdnjs.cloudflare.com/ajax/libs/aframe/0.7.1/aframe.min.js< / script> < script src = js / build.js>< / script> < / head> < body> < a-scene background = color：white> < a-assets> < img id = mozvr src = img / logo.png> < img id = shadow2 src = img / radial-shadow-2.png> < img id = ui1 src = img / ui-1.png> < img id = ui2 src = img / ui-2.png> < img id = ui3 src = img / ui-3.png> < img id = 3d src = img / 3d.png> < img id = 3dcity src = img / 3dcity.png> < img id = 3dclock src = img / 3dclock.png> < / a-assets> <！-< a-box id = blue-cube position =-3.5 3.5 -2 rotation = 30 30 0 width = 2 depth = 2 height = 2 color = blue href =＃orange-cube>< / a-box> -> < a-curvedimage href = hall.html src =＃ui1 radius = 5.7 theta-length = 70 height = 3.02 rotation = 0155 0 scale = 0.8 0.8 0.8> ;< / a-curvedimage> < a-curvedimage src =＃mozvr radius = 5.7 theta-length = 20 height =。7 opacity = 0.6 rotation = 0 250 0 position = 0 2 0> < / a-curvedimage> < a-curvedimage src =＃ui3 radius = 5.7 theta-length = 70 height = 3.02 rotation = 0 80 0 scale = 0.8 0.8 0.8 href = clock.html> ;< / a-curvedimage> < a-curvedimage src =＃ui2 radius = 5.7 theta-length = 70 height = 3.02 rotation = 0 -130 0 scale = 0.8 0.8 0.8 href = titanic.html < / a-curvedimage> < a-curvedimage src =＃3d position = 0 -2.5 0 radius = 5.7 theta-length = 70 height = 3.02 rotation = 0 -130 0 scale = 0.8 0.8 0.8 > / a-curvedimage> < a-curvedimage src =＃3dclock position = 0 -2.5 0 radius = 5.7 theta-length = 70 height = 3.02 rotation = 0 80 0 scale = 0.8 0.8 0.8 href = model.html>< / a-curvedimage> < a-curvedimage src =＃3dcity position = 0 -2.5 0 radius = 5.7 theta-length = 70 height = 3.02 rotation = 0 155 0 scale = 0.8 0.8 0.8 < / a-curvedimage> < a图像位置= 0 -5 0 src =＃shadow2旋转=-90 0 0 scale = 6 6 6< / a-图像> < a-entity position = 0 0 1> < a-camera> < a光标color =＃4CC3D9>< / a光标> < / a-camera> < / a-entity> < a-sky background = color：white>< / a-sky> < / a-scene> < / body> < / html>
解决方案
使用链接组件：
< a-curvedimage link = href：hall.html; on：单击>< / a-curvedimage>
请注意，仅Firefox，Oculus Browser，Samsung Internet和Supermedium支持In-VR导航。 / p>
I'm trying to link these curved images in a-frame to my other HTML Pages which are:
hall.html
clock.html
titanic.html
I've researched it online but haven't been able to find an answer so if anyone has any experience with a-frame the help would be appreciated.
Essentially what I'm trying to do is when someone looks at one of the curved images in a-frame it takes them to the HTML page.
Thanks
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>360Belfast</title>
<meta name="description" content="Curved Images - A-Frame">
<script src="https://cdnjs.cloudflare.com/ajax/libs/aframe/0.7.1/aframe.min.js"></script>
<script src="js/build.js"></script>
</head>
<body>
<a-scene background="color: white">
<a-assets>
<img id="mozvr" src="img/logo.png">
<img id="shadow2" src="img/radial-shadow-2.png">
<img id="ui1" src="img/ui-1.png">
<img id="ui2" src="img/ui-2.png">
<img id="ui3" src="img/ui-3.png">
<img id="3d" src="img/3d.png">
<img id="3dcity" src="img/3dcity.png">
<img id="3dclock" src="img/3dclock.png">
</a-assets>
<!-- <a-box id="blue-cube" position="-3.5 3.5 -2" rotation="30 30 0"
width="2" depth="2" height="2" color="blue"
href="#orange-cube"></a-box> -->
<a-curvedimage href="hall.html" src="#ui1" radius="5.7" theta-length="70" height="3.02"
rotation="0 155 0" scale="0.8 0.8 0.8"></a-curvedimage>
<a-curvedimage src="#mozvr" radius="5.7" theta-length="20" height=".7"
opacity="0.6" rotation="0 250 0" position="0 2 0"></a-curvedimage>
<a-curvedimage src="#ui3" radius="5.7" theta-length="70" height="3.02"
rotation="0 80 0" scale="0.8 0.8 0.8" href="clock.html"></a-curvedimage>
<a-curvedimage src="#ui2" radius="5.7" theta-length="70" height="3.02"
rotation="0 -130 0" scale="0.8 0.8 0.8" href="titanic.html"></a-curvedimage>
<a-curvedimage src="#3d" position="0 -2.5 0" radius="5.7" theta-length="70" height="3.02"
rotation="0 -130 0" scale="0.8 0.8 0.8"></a-curvedimage>
<a-curvedimage src="#3dclock" position="0 -2.5 0" radius="5.7" theta-length="70" height="3.02"
rotation="0 80 0" scale="0.8 0.8 0.8" href="model.html"></a-curvedimage>
<a-curvedimage src="#3dcity" position="0 -2.5 0" radius="5.7" theta-length="70" height="3.02"
rotation="0 155 0" scale="0.8 0.8 0.8"></a-curvedimage>
<a-image position="0 -5 0" src="#shadow2" rotation="-90 0 0" scale="6 6 6"></a-image>
<a-entity position="0 0 1">
<a-camera>
<a-cursor color="#4CC3D9"></a-cursor>
</a-camera>
</a-entity>
<a-sky background="color: white"></a-sky>
</a-scene>
</body>
</html>
解决方案
Use the link component:
<a-curvedimage link="href: hall.html; on: click"></a-curvedimage>
Note that In-VR navigation is only supported by Firefox, Oculus Browser, Samsung Internet and Supermedium.
这篇关于如何在框架中创建链接？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
