Menu
Hello I have just started using A-Frame.io and am finding the website very useful. However there is no documentation on how to make a link work if i look at an object.
https://aframe.io/examples/showcase/cursor/
in the example above if you hover the reticle over the cube using the middle mouse button it changes shape.
Is there a way to make a web link work when that cube is triggered.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Cursor</title>
<meta name="description" content="Cursor — A-Frame">
<script src="../../dist/aframe.js"></script>
</head>
<body>
<a-scene>
<a-entity position="0 1.8 4">
<a-camera id="camera">
<a-cursor color="#4CC3D9"></a-cursor>
</a-camera>
</a-entity>
<a-box id="orange-cube" position="0 3.5 -2" rotation="30 30 0" width="2" depth="2" height="2" color="#F16745" roughness="0.8">
<a-event name="mouseenter" scale="3 1 1" color="#FFC65D"></a-event>
<a-event name="mouseenter" target="#shadow" scale="3 2 2"></a-event>
<a-event name="mouseleave" scale="1 1 1" color="#F16745"></a-event>
<a-event name="mouseleave" target="#shadow" scale="2 2 2"></a-event>
</a-box>
<a-image id="shadow" position="0 0 -2" src="../_images/radial-shadow-2.png" opacity="0.5" rotation="-90 0 0" scale="2 2 2"></a-image>
<a-sky color="#ECECEC"></a-sky>
</a-scene>
</body>
</html>
483
A-Frame still works on standard desktop and smartphones.
A-Frame is an open-source web framework for building virtual reality (VR) experiences. It is maintained by developers from Supermedium (Diego Marcos, Kevin Ngo) and Google (Don McCurdy). A-Frame is an entity component system framework for Three. js where developers can create 3D and WebVR scenes using HTML.
An HTML document that describes frame layout (called a frameset document ) has a different makeup than an HTML document without frames. A standard document has one HEAD section and one BODY . A frameset document has a HEAD , and a FRAMESET in place of the BODY .
You can add an event listener, or write a link component.
el.addEventListener('click', function () {
window.location.href = 'https://google.com';
});
Component:
AFRAME.registerComponent('link', {
schema: {default: ''},
init: function () {
var url = this.data;
this.el.addEventListener('click', function () {
window.location.href = url;
});
}
});
```
147
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
