The settings, live
These four controls do one thing: set a data-* attribute on the component. It reads them
again on its own. The angles, the colours and the durations are not here — they are CSS variables.
Where the point that does not tilt is.
Higher is snappier.
Below 20, the scene overshoots and comes back.
The reference behaviour is "yes".
The same scene, at a third of the size
Nothing has changed but --pxs-scene-width. The depths are ratios of that length, so the
composition is identical — this is not a reduction, it is the same thing, smaller.
The frame of reference is the component
This one carries data-tracking="element": it only tilts when the pointer is over it, and
its own centre is the point of rest. That is what you want as soon as there is more than one scene on the page.