title: html2canvas returns invalid image when the body height is more than 30000 pixels
body: <p>The html2canvas library behaves strangely when I need to capture a control placed on an html body which is more than 30000 pixels long. My control is small (100 x 100) - but the script doesn't work when the body is long.</p>
  
  <hr>
  
  <p>Here are two fiddles one is working other one is not working different body sizes</p>
  
  <ul>
  <li><a href="https://jsfiddle.net/fvo1xh8b/2/" rel="nofollow">body size 40000px (not working)</a></li>
  <li><a href="https://jsfiddle.net/fvo1xh8b/3/" rel="nofollow">body size 30000px (working)</a></li>
  </ul>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function() {
    $('#test').on('click', function() {
      html2canvas(document.getElementById('container'), {
        onrendered: function(canvas) {
          document.body.appendChild(canvas);
        },
      });
    });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://html2canvas.hertzen.com/build/html2canvas.js"&gt;&lt;/script&gt;
  
  &lt;body style="height:40000px"&gt;
  
   &lt;button id="test"&gt;test&lt;/button&gt;
  
   &lt;div id='container'&gt;
     &lt;img style='width:200px; height:200px;' src="www.example.com/example.jpg"&gt;
   &lt;/div&gt; 
  &lt;/body&gt;
  
   </code></pre>
  </div>
  </div>
  </p>
  
  <p>In the above example, the library returns an image - but the data is not valid. If I change the body height to something like 20000 pixels, everything works fine </p>