Pagination

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 20
  8. 21
HTML
<div class="fizz-pagination">
<button id="previous" class="fizz-icon-button" disabled><svg class="fizz-icon-16" role="img" aria-hidden="true" width="24" height="24">
<use xlink:href="#icon-chevron-left"></use>
</svg></button>
<ol class="fizz-pagination-list">
<li class="fizz-is-active" data-page="1 of 21"><a href="#">1</a></li>
<li data-page="2 of 21"><a href="#">2</a></li>
<li data-page="3 of 21"><a href="#">3</a></li>
<li data-page="4 of 21"><a href="#">4</a></li>
<li data-page="5 of 21"><a href="#">5</a></li>
<li data-page="6 of 21"><a href="#">6</a></li>
<li><a href="#">&mldr;</a></li>
<li data-page="20 of 21"><a href="#">20</a></li>
<li data-page="21 of 21"><a href="#">21</a></li>
</ol>
<button id="next" class="fizz-icon-button"><svg class="fizz-icon-16" role="img" aria-hidden="true" width="24" height="24">
<use xlink:href="#icon-chevron-right"></use>
</svg></button>
</div>