title: jQuery Mobile popup content height exceeds window height
body: <p>The <a href="http://jquerymobile.com/demos/1.2.0/docs/pages/popup/" rel="nofollow noreferrer">jQuery Mobile popup</a> dimensions are limited to having a <a href="http://jquerymobile.com/demos/1.2.0/docs/pages/popup/options.html" rel="nofollow noreferrer">15px margin on the left an right sides, and a 30px margin on the top and bottom</a>. If the content is too large for these constraints, then the popup grows longer (not wider), so that the whole page must be scrolled to view the popup content.</p>
  
  <p>I need to change this behavior such that the popup dimensions never exceed the height of the window, and such that the content scrolls vertically within the popup.</p>
  
  <p>It is possible to limit the size of the popup thusly:</p>
  
  <pre class="lang-js prettyprint-override"><code>$('#popup').on({
    popupbeforeposition: function() {
      var maxHeight = $(window).height() - 30
      $('#popup').css('max-height', maxHeight + 'px')
    }
  })
  </code></pre>
  
  <p>...but the popup content is the same, passing the bottom of the popup and still forcing the user to scroll the page, rather than the content within the popup.</p>
  
  <p><strong>How do I allow the popup content to scroll vertically within the popup?</strong></p>
  
  <p><img src="https://i.stack.imgur.com/Xjpyi.png" alt="popup content goes past window bottom"></p>