title: turn.js display option based on window width
body: <p>i am trying to make a flipbook with turn.js which is awesome.
  the only problem i have is that i am trying to make it so in mobies it is single page display and in desktops double page display.
  it does have the option to choose when creating the flipbook in javascript
  display: 'single' or display: 'double'</p>
  
  <p>i managed to achive changing that when you resize the window but with the onresize jwuery event but that makes it so it triggers only when you resize the window but if you dont it is always double page...so when the browser renders the page for mobile it is as defaul double page and not single</p>
  
  <p>let me post my code here
          // Create the flipbook</p>
  
  <pre><code>flipbook.turn({
  
          // Magazine width
  
          width: 922,
  
          // Magazine height
  
          height: 600,
  
          // Duration in millisecond
  
          duration: 1000,
  
          // Enables gradients
  
          gradients: true,
  
          // Auto center this flipbook
  
          autoCenter: true,
  
          // Elevation from the edge of the flipbook when turning a page
  
          elevation: 50,
  
          // The number of pages
  
          pages: 12,
  
  
          // Events
  
          when: {
              turning: function(event, page, view) {
  
                  var book = $(this),
                  currentPage = book.turn('page'),
                  pages = book.turn('pages');
  
                  // Update the current URI
  
                  Hash.go('page/' + page).update();
  
                  // Show and hide navigation buttons
  
                  disableControls(page);
  
              },
  
              turned: function(event, page, view) {
  
                  disableControls(page);
  
                  $(this).turn('center');
  
                  $('#slider').slider('value', getViewNumber($(this), page));
  
                  if (page==1) {
                      $(this).turn('peel', 'br');
                  }
  
              },
  
              missing: function (event, pages) {
  
                  // Add pages that aren't in the magazine
  
                  for (var i = 0; i &lt; pages.length; i++)
                      addPage(pages[i], $(this));
  
              }
          }
  
  });
      //change from single to double page
        $(window).resize(function(){
           var win = $(this); //this = window
           if (win.width() &gt;= 820) { flipbook.turn('display','double');}
           else {
             flipbook.turn('display','single');
           }
     });
  </code></pre>
  
  <p>i hope someone can help me fix this</p>