Input Steps

Pointer input: hover, drag, double click, right click, tap, viewport resize. The mouse and touch toolkit.

Step phrasings in this group

The book sidebar lists each individual step page under this group.

When I hover over "#nav-products"

Hover the mouse pointer over a CSS-addressed element.

When I move the pointer to "#cta"

Move the mouse pointer over a CSS-addressed element (alias for hover).

When I double-click on "#row-1"

Double-click on a CSS-addressed element.

When I right-click on "#row-1"

Right-click (context menu) on a CSS-addressed element.

When I middle-click on "a.external"

Middle-click on a CSS-addressed element.

When I click on "#row-1" while holding "Shift"

Click on a CSS-addressed element while holding a modifier key.

When I drag "#card-1" to "#column-done"

Drag a source element onto a target element.

When I set the viewport size to 1280x720

Resize the browser viewport to a specific WxH.

When I tap on "#cta"

Touch-tap a CSS-addressed element. Falls back to a regular click if the

Back to all step groups