Scania Group

Demo of Navigation

To understand the behaviour of the main navigation in different viewport widths, please re-size your browser window and observe how the primary nav items are re-located and placed on the More menu.

To be able to switch the information of the items please look at the Source Code, by right clicking or ctrl + u

This page contains How to:

  • Set primary and secondary items with angular
  • Switch between items in the menu, for example language
  • Set Dropdown by using "Dropdown":"true"
  • See More is working by resizing
  • Switch the more text with attribute more-text
  • Set Caption on sub-navigation
  • Set specific order by using index: -1 for example
  • Set active active item, by using class="active" or "active:true"
Nav-item