Navigation and Progress

Configure controls, thumbnails, dots, numbers, keyboard navigation, swipe support, and progress indicators.

Navigation and Progress

Arrow Controls

The slider can display next and previous controls with:

  • optional center alignment
  • selectable control styles
  • selectable control icon sets
  • optional text labels

Thumbnails

Thumbnail navigation supports:

  • enable or disable thumbnails
  • centered thumbnails
  • boxed thumbnail layout
  • rewind behavior
  • max width
  • thumbnail count
  • thumbnail height
  • minimum thumbnail width

Numbers

Number navigation supports:

  • enable or disable numbers
  • centered placement
  • style selection
  • main color
  • active color
  • text color
  • tooltip style

Dots

Dots navigation supports:

  • enable or disable dots
  • centered placement
  • style selection
  • main color
  • active color
  • tooltip style

Modern Nav Addon

The optional Modern Nav addon adds four scoped navigation designs without replacing the core slider runtime.

Its slider settings can include:

  • enable or disable Modern Navigation
  • center navigation
  • navigation style
  • tooltip style
  • main color
  • active color

When Modern Nav is enabled, the addon disables the core dots/numbers display for that slider and renders its own navigation through Zoro Slider hooks. Disabling the addon setting restores the normal core navigation behavior.

Modern Nav styles are scoped to Zoro Slider markup and are included by the Export HTML addon when both addons are active.

Keyboard and Swiping

The slider can respond to:

  • keyboard arrow navigation
  • swipe gestures

Progress Indicators

The plugin includes two progress styles:

Progress Bar

Configurable options:

  • position
  • thickness
  • fill color
  • background color

Radial Progress

Configurable options:

  • position
  • ring thickness
  • offset
  • fill color
  • background color