Options
All
  • Public
  • Public/Protected
  • All
Menu

Class SkipNavComponent

whatitdoes

Provides a shortcut button to skip the main navigation for accessibility purposes.

Features:

  • Only shows the skip button on focus (usually the first tab keypress)
  • Can Automatically skip navigation on route changes if the page has already loaded.
  • Uses aria-label to notify the user that navigation has been skipped
  • Can easily be reused! This is a html container element that wraps around the main navigation so you can just drop in any navigation component and it should work as expected.

Hierarchy

  • SkipNavComponent

Implements

  • OnInit

Index

Constructors

constructor

Properties

Private initalLoadComplete

initalLoadComplete: boolean = false

Indicates if the initial page load has completed.

Private router

router: Router

used to listen to route changes

skipLabel

skipLabel: string

The aria-label text provided after navigation is skipped.

startContentIndex

startContentIndex: number = null

Tabindex given to the div that receives focus after skipping navigation.

startOfContent

startOfContent: ElementRef

A reference to the div that receives focus after skipping navigation.

Methods

autoSkipNav

  • autoSkipNav(): void

Private focusPastNav

  • focusPastNav(): void

ngOnInit

  • ngOnInit(): void

skipNavigation

  • skipNavigation(): void

startContentBlur

  • startContentBlur(): void

Generated using TypeDoc