Every node in the Scene Editor gets the same Node and Transform properties along with some others. The node type pages only cover what's specific to each type; this page covers the rest.
Node
- Name: A plain label for the node, shown in the scene tree.
- Id: The identifier used to reach the node from code as
this.dom.<id>. A node isn't referenceable by default. Click the reference icon next to Id to start editing it (which makes it referenceable). - Visible: Shows or hides the node.
- No Select: this reflects whether the node is user-selectable or not (text-selectable, drag-selectable).
Transform
- Position (x, y) and Size (w, h), each switchable between px and %. Size doesn't apply to Marker or Animator nodes, which have no visual box of their own.
- Rotation, in degrees.
- Scale (x, y).
- Skew (x, y), in degrees.
- Origin (x, y), as a percentage. This is what Rotation/Scale/Skew pivot around. Defaulting to 50/50 (dead center).
- Opacity (0-1) the alpha of the element and its children.
- Z-Index The draw order of the element compared to its siblings.
Events
A list of DOM event bindings and a handler name:
- click
- mouseenter
- mouseleave
- mousedown
- mouseup
- contextmenu
- focus
- blur
- keydown
- keyup.
CSS
Free-form custom CSS declarations on the node, plus a collapsible "Advanced" section. This is separate from the Styles Manager's named styles.
Animations
This is a list of all animations listen in the scene that can be accessed by the element CSS or State's CSS
States
A repeatable list of named CSS-variant states (see setState() in Coding and Scene Editor), each with its own CSS rules. A "Preview state" bar appears at the top of the inspector once a node has any states defined, so you can preview with a click.