ScrollingNav

Handles the transitions within the sticky header as users scroll down the page.

Source:
Properties:
Name Type Description
durations objects

List of animated durations in milliseconds.
actions object

Set of flags that can be used to toggle various menu transitions.
selectors object

Set of flags that can be used to grab navbar components.
status object

Set of flags identifying the status of each navbar transition.

Methods

(inner) animateIn($elem, $mode)

Source:

Apply proper css for animating in target $elem

Parameters:
Name Type Description
$elem number
$mode string

(inner) animateOut($elem, $mode)

Source:

Apply proper css for animating out target $elem

Parameters:
Name Type Description
$elem number
$mode string

(inner) attachTriggers(selector, callbacks)

Source:

Bind InView listener for transition triggers.

Parameters:
Name Type Description
selector string

CSS selector for the transition trigger element.
callbacks array

Array of callback handlers and keys.

(inner) clearTimeout(id)

Source:

Clear timeout of a timeout id when defined.

Parameters:
Name Type Description
id number

integer

(inner) hideTitleAndSocial(key)

Source:

Handles actions for animating out and hiding Title and Social nav

Parameters:
Name Type Description
key string

(inner) init()

Source:

Initializes navbar transition triggers.

(inner) resetTransitions()

Source:

Resets Social Nav/Main Nav Transitions Sometimes on iOS devices 'transitionTitleAndSocial' is not triggered when 'Back to Top' button is clicked This method is called in BackToTop.js to trigger this transition

(inner) transitionCustomTemplate(boundary, key, event)

Source:

Handles adding opaque background and styling class to menu on custom template when user scrolls past hero sections

Parameters:
Name Type Description
boundary object

The bounding box values of the trigger element.
key string

String to select the appropriate status setting.
event object

Intersection Observer callback object with InView.

(inner) transitionInteractiveTemplate(boundary, key, event)

Source:

Handles adding opaque background and styling class to menu on interactive template when user scrolls past the main content section

Parameters:
Name Type Description
boundary object

The bounding box values of the trigger element.
key string

String to select the appropriate status setting.
event object

Intersection Observer callback object with InView.

(inner) transitionMobileButtons(boundary, key, event)

Source:

Handles smoothly removing mobile menu button labels and shrinking nav when user scrolls past the header

Parameters:
Name Type Description
boundary object

The bounding box values of the trigger element.
key string

String to select the appropriate status setting.
event object

Intersection Observer callback object with InView.

(inner) transitionNav(boundary, key, event)

Source:

Handles smoothly shrinking the logo and updating navigation style when the user scrolls past the header.

Parameters:
Name Type Description
boundary object

The bounding box values of the trigger element.
key string

String to select the appropriate status setting.
event object

Intersection Observer callback object with InView.

(inner) transitionRadio(boundary, key, event)

Source:

Handles smoothly adding and removing the radio widget in sticky nav when user scrolls past radio nav

Parameters:
Name Type Description
boundary object

The bounding box values of the trigger element.
key string

String to select the appropriate status setting.
event object

Intersection Observer callback object with InView.

(inner) transitionTitleAndSocial(boundary, key, event, reset)

Source:

Handles smoothly adding toggling between the topics list and title / social menu.

Parameters:
Name Type Description
boundary object

The bounding box values of the trigger element.
key string

String to select the appropriate status setting.
event object

Intersection Observer callback object with InView.
reset boolean

Flags if this transition is triggered by Back To Top scrolling.