Skip to example

iOS slider

An example of recreating the iOS slider using Motion for Vue. This example uses useTransform to map input to slider state, and slider state to pull, squish and squash animations. It uses Vue's onFocus and onBlur to set up keyboard-accessible inputs, with Motion's whileFocus prop to animate a custom focus indicator.

Not ready? Try 10 Motion+ demos free.

Create a free Motion account to run 10 Motion+ demos live, with their controls. No card needed.