<!DOCTYPE html>
<html>
<head>
<title>Interactions - 04 - Targets</title>
<script src="https://aframe.io/releases/1.5.0/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-environment-component/dist/aframe-environment-component.min.js"></script>
<script src="https://unpkg.com/aframe-event-set-component/dist/aframe-event-set-component.min.js"></script>
</head>
<body>
<a-scene cursor="rayOrigin: mouse">
<a-entity environment="preset: goldmine; dressingAmount: 20"></a-entity>
<a-box
id="redbox"
width="0.5"
height="0.5"
depth="0.5"
position="-1 1.6 -2"
color="red"
event-set__mouseenter="_target:#greenbox; height: 1"
event-set__mouseleave="_target:#greenbox; height: 0.5"
></a-box>
<a-box
id="greenbox"
width="0.5"
height="0.5"
depth="0.5"
position="0 1.6 -2"
color="green"
event-set__mouseenter="_target:#bluebox; height: 1"
event-set__mouseleave="_target:#bluebox; height: 0.5"
></a-box>
<a-box
id="bluebox"
width="0.5"
height="0.5"
depth="0.5"
position="1 1.6 -2"
color="blue"
event-set__mouseenter="_target:#redbox; height: 1"
event-set__mouseleave="_target:#redbox; height: 0.5"
></a-box>
<a-camera>
<a-cursor></a-cursor>
</a-camera>
</a-scene>
</body>
</html>