SaaS ebook per-chapter navigation footer from jQuery Mobile

chapter_nav_footer.html

<div data-role="footer" data-id="global-nav" data-position="fixed" class="ui-bar">
  <div class="contents-nav" data-role="controlgroup" data-type="horizontal">
    <a href="#toc" data-role="button" data-inline="true" data-icon="grid">Contents</a>
    <select class="chapter-contents" data-inline="true">
      <optgroup label="Chapter 1">
        <option value="#x1-80001.0">1.0 Engineering Software is Different from Engineering Hardware</option>
        <option value="#x1-100001.1">1.1 Introduction</option>
        <option value="#x1-110001.2">1.2 Product Lifetimes: Independent Products vs. Continuous Improvement</option>
        <option value="#x1-120001.3">1.3 Development Processes: Waterfall versus Agile</option>
        <!-- rest of Chapter 1 sections -->
      </optgroup>
    </select>
  </div>
  <div class="page-nav" data-role="controlgroup" data-type="horizontal" data-inline="true">
    <a class="prev-page" href="#" data-role="button" data-icon="arrow-l" data-iconpos="left">Prev</a>
    <a class="next-page" href="#" data-role="button" data-icon="arrow-r" data-iconpos="right">Next</a>
  </div>
</div>