Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Page Properties

Component type

Carousel/Slider

Document status

Status
colourRed
titleDRAFT

Design source (in Figma)

List controls

Author

nathan.mckean@reckitt.com (Unlicensed)

Responsible

Julia Boyarshchikova (Deactivated)

Milestone

4

Carousels allow multiple pieces of content to occupy a single, defined space.

DISCUSS Terminology (Carousel vs slider. One item per frame vs multi, slide animation vs other).

...

  • Touch: For the closest demonstration of thisThe user can scroll the list sideways by touch fluidly with items “snapping” into place when movement stops. Tapping the button controls will batch contents a “visible” frame at a time. If the list loads with [1][2][3] visible, tapping next will reveal [4][5][6]. If the list item had 8 items, tapping next again would show [6][7][8] and the next button would disable. Clicking the items within the carousel, if interactive would deliver the expected action for that item (e.g. link to xyz).

  • Keyboard: TBC - see Accessibility.

  • Mouse:

  • All: Lists do not loop and therefore back and next buttons will disable when the list is at the start and end.

...