Scrollspy

Available as: Web ComponentOxygen Element

Automatically add CSS classes to navigation items and content elements depending on the scroll position.

Properties

content-class

Type: stringDefault: 'spx-scrollspy__content--active'

Applied class to active content element.

display

Type: stringDefault: 'block'CSS variable: --spx-scrollspy-display

Component display property.

nav-class

Type: stringDefault: 'spx-scrollspy__nav--active'

Applied class to active navigation element.

offset

Type: any

Selects the height of an element (any querySelector value) or number that is used for offsetting how far from the top the next section is activated.

scrolling

Type: number

Activates automatic navigation scrolling and sets the offset.

target

Type: stringDefault: 'a'

Target element. Can take any querySelector value. (id, class, tag etc.)

url-change

Type: booleanDefault: false

Appends the currently active link to the end of the URL.

Events

spxScrollspyDidLoad

Fires after component has loaded.

Methods

reload

Reload component.