title: Jquery mobile, pagination
body: <p>I'm making a simple comments page for a mobile site. The trouble I have is I am trying to make my fixed header show what posts are showing. so 1-6 on the first page, 7-12 on the next.</p>
  
  <p>This is all to be triggered with a swipe left or right to the next page will add 6 to the variables.</p>
  
  <p>The trouble I have is the variables are resetting to their original set value.</p>
  
  <p>How do I get the variables to add and decrease with the 2 functions without resetting.</p>
  
  <pre><code>$(document).on('pageinit', function(event){
  
  var currentStart = 1;
  var currentEnd = 6;
  
    $('div.ui-page').on("swipeleft", function () {
      var nextpage = $(this).next('div[data-role="page"]');
        if (nextpage.length &gt; 0) {
          $.mobile.changePage(nextpage, { transition: "slide"},"slide", false, true);
          currentStart += 6;
          currentEnd += currentEnd + 6;
          $('#currentStart').empty().append(currentStart);
          $('#currentEnd').empty().append(currentEnd);
  
        }
    });
  
    $('div.ui-page').on("swiperight", function () {
      var prevpage = $(this).prev('div[data-role="page"]');
      if (prevpage.length &gt; 0) {
        $.mobile.changePage(prevpage, { transition: "slide", reverse: true }, true, true);
        currentStart = currentStart - 6;
        currentEnd = currentEnd - 6;
        $('#currentStart').empty().append(currentStart);
        $('#currentEnd').empty().append(currentEnd);
      }
    });
  </code></pre>
  
  <p>So every time you swipe left or right the <code>currentStart</code> will increment up by 6 or decrease by 6, however everytime you swipe the variables are resetting to their original declaration.</p>
  
  <p>How do I stop that?</p>