Javatpoint Logo
Javatpoint Logo

Framework7 Navbars

Navbars are placed at the top of the screen and contain title of the page and navigation elements. Navbar contains three parts each of which may contain any HTML content, but it is preferred to use these in the following way:

  • Left: It is used to place back link icons or single text link.
  • Center: It is used to display title of the page or tab links.
  • Right: It is same as left part.

A list of Navbar types with description:

Index Navbar Type Description
1) Basic navbar A basic navbar can be created by using the navbar, navbar-inner, left, center and right classes.
2) Navbar with links To use links in left and right part of your navbar, just add tag with class link.
3) Multiple links To use multiple links, just add few more to the part of your choice.
4) Links with text and icons The links can be provided with icons and texts by adding classes for icons and wrapping the link text with element.
5) Links with only icons Navbar links can be provided with only icons by adding icon-only class to links.
6) Related app and view methods On initializing the View, framework7 allows you to use methods available for navbar.
7) Hide navbar automatically The navbar can be hidden/shown automatically for some Ajax loaded pages where navbar is not required.

Youtube For Videos Join Our Youtube Channel: Join Now


Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Trending Technologies

B.Tech / MCA