Navbar consists of 3 parts each of which may contain any HTML content, but it is recommended to use them as mentioned below:
- Left: This is designed to place back link icons or single text link.
- Center: This is used to display title of the page or tab links.
- Right: This part can be used similar as left part.
Below table demonstrates the use of navbar:
S.N. |
Navbar Types & 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 <a> tag with class link. |
3 |
Multiple links
To use multiple links, just add few more <a class="link"> to the part of your choice. |
4 |
Links with text and icons
These links can be provided with icons and text by adding classes for icons and wrapping the link text with <span> 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
Navbar can be hidden/shown automatically for some Ajax loaded pages where navbar is not required. |