Component

Compare Slider

Drag, or use the arrow keys, to reveal the image underneath. The control is a native <input type="range"> : everything to do with the keyboard, with touch and with accessibility comes from the browser.

The renovated room: limewashed walls, pale oak floorboards, a linen sofa under the window, a marble fireplace.
The same room before the works: flaking plaster, a stained ceiling, a dusty concrete floor, a cast iron radiator.
Before After

What the keyboard does

← →
moves by one step
⇞ ⇟
moves by ten steps
⇱ ⇲
all the way left, all the way right

In vertical mode it is ↑ and ↓: it is the browser that turns the control, not a script.