aframecursors


Introduction

The cursor component lets us interact with entities through clicking and gazing.

Syntax

  • <a-entity cursor=""></a-cursor>
  • <a-cursor></a-cursor>

Parameters

PropertyDescription
fuseWhether cursor is fuse-based. Default value: false on desktop, true on mobile
fuseTimeoutHow long to wait (in milliseconds) before triggering a fuse-based click event. Default value: 1500

Remarks

The cursor is a specific application of the raycaster component in that it

  • Listens for mouse clicks and gaze-based fuses
  • Captures only the first intersected entity
  • Emits special mouse and hover events (e.g., relating to mouse down/up/enter/leave)
  • Has more states for hovering.

When the mouse clicks, the closest visible entity intersecting the cursor, if any, will emit a click event. Note the cursor component only applies the raycasting behavior. To provide a shape or appearance to the cursor, you could apply the geometry and material components.


Events

EventDescription
clickEmitted on both cursor and intersected entity if a currently intersected entity is clicked (whether by mouse or by fuse).
fusingEmitted on both cursor and intersected entity when fuse-based cursor starts counting down.
mousedownEmitted on both cursor and intersected entity (if any) on mousedown on the canvas element.
mouseenterEmitted on both cursor and intersected entity (if any) when cursor intersects with an entity.
mouseleaveEmitted on both cursor and intersected entity (if any) when cursor no longer intersects with previously intersected entity.
mouseupEmitted on both cursor and intersected entity (if any) on mouseup on the canvas element.