You've now seen a few examples of headers and footers that include buttons, but jQuery Mobile has a cleaner version of this called navigation bars (navbars). These are fullscreen-wide bars used to hold buttons. jQuery Mobile also supports highlighting one button at a time as an active button. When used for navigation, this is an easy way to mark a page as being active.
A navbar is simply an unordered list wrapped in a div tag that uses data-role="navbar". Placed inside a footer, it looks similar to the following code snippet:
<div data-role="footer">
<div data-role="navbar">
<ul>
<li><a href="header_and_footer__with_navbar.html" class="ui-btn-active">Home</a></li>
<li><a href="header_and_footer__with_navbar_credits.html">Credits</a></li>
<li><a href="header_and_footer__with_navbar_contact.html">Contact</a></li>
</ul>
</div>
</div...