Focus Nav

How it works

Focus Nav is a nestable widgets. It contains “Focus Items” where the focus corners will morph when the user hovers on them.

Content tab

Settings group

Direction: nav’s direction. Column or row.
Event: determines when to morph the focus corners: click or hover.
Page name as active item: determines the default Focus Item whose color will be active on page load if it matches the Page’s title.
Active item: determines the default Focus Item whose color will be active on page load. e.g: “1” will set first Focus item as the active one on page load. Requires “Page name as active item” to be disabled.

Animations group

There are 3 animations available: Display and Morphing applied to the Focus Corners and Color applied to Focus Items on hover and when being active.

Style tab

Focus Corners’ styles can be set at the Corners group.
Focus Items styles can be styled at the Focus Items group at once or individually at each Focus Item element.
There are more groups to customize Focus Nav at pleasure.