title: using html2canvas, children not showing up in output image
body: <p>I'm trying to save a div element as an image. When I press on an image, it gets appended to said div. When I press the 'save' button, it's supposed to take a 'screenshot' of the div with the images added to it (as children), but the image turns out blank.</p>
  
  <p>At first, it turned out black, but I set the background-color as white on the div, and now it's white instead. The children of the div is still not showing up, though. </p>
  
  <p><strong>Update: I tried saving the images on my computer and using those, instead of imgur, and the images are still not showing up in the 'screenshot'. The output images are 2.15 KB large, so they're not 'empty'.</strong></p>
  
  <p>I'm using:</p>
  
  <p>html2canvas.js <a href="http://html2canvas.hertzen.com/" rel="nofollow noreferrer">http://html2canvas.hertzen.com/</a></p>
  
  <p>FileSaver.js <a href="https://github.com/eligrey/FileSaver.js/" rel="nofollow noreferrer">https://github.com/eligrey/FileSaver.js/</a></p>
  
  <p>Blob.js, canvas-toBlob.js, jquery 1.9.1</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(function(){
      $("#btnSave").click(function() { 
          html2canvas( $("#base") , {
              onrendered: function(canvas) {
                  theCanvas = canvas;
                  canvas.toBlob(function(blob) {
                      saveAs(blob, "avatar"); 
                  });
              }
          });
      });
  });</code></pre>
  </div>
  </div>
  </p>
  
  <p>before appending additional images:
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#base {
    width: 200px;
    height: 330px;
    float: left;
    position: relative;
    background-color: #FFF;
  }
  
  #base img {
    pointer-events: none;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="base"&gt;
        &lt;img src="https://i.imgur.com/wGSH6Xs.png"&gt;
      &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>after appending additional images:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#base {
    width: 200px;
    height: 330px;
    float: left;
    position: relative;
    background-color: #FFF;
  }
  
  #base img {
    pointer-events: none;
  }
  
  img.onDoll {
    position: absolute;
    top: 0;
    left: 0;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="base"&gt;
        &lt;img src="https://i.imgur.com/wGSH6Xs.png"&gt;
      &lt;img class="category hair onDoll" id="item_id_1" src="https://i.imgur.com/k0TXwzN.png"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><strong>Update: This is the log after running it with allowTaint: true</strong> </p>
  
  <pre><code>html2canvas.js:2506 91ms html2canvas: Document cloned
  html2canvas.js:2506 96ms html2canvas: Initialized CanvasRenderer with size 944 x 495
  html2canvas.js:2506 97ms html2canvas: Starting NodeParser
  html2canvas.js:2506 100ms html2canvas: Fetched nodes, total: 5
  html2canvas.js:2506 101ms html2canvas: Calculate overflow clips
  html2canvas.js:2506 105ms html2canvas: Start fetching images
  html2canvas.js:2506 106ms html2canvas: Added image #1 https://i.imgur.com/wGSH6Xs.png
  html2canvas.js:2506 107ms html2canvas: Added image #2 https://i.imgur.com/k0TXwzN.png
  html2canvas.js:2506 108ms html2canvas: Finished searching images
  html2canvas.js:2506 109ms html2canvas: Succesfully loaded image #1 ImageContainer {src: "https://i.imgur.com/k0TXwzN.png", image: img, tainted: null, promise: $$es6$promise$promise$$Promise}
  html2canvas.js:2506 112ms html2canvas: Succesfully loaded image #2 ImageContainer {src: "https://i.imgur.com/wGSH6Xs.png", image: img, tainted: null, promise: $$es6$promise$promise$$Promise}
  html2canvas.js:2506 113ms html2canvas: Images loaded, starting parsing
  html2canvas.js:2506 113ms html2canvas: Creating stacking contexts
  html2canvas.js:2506 114ms html2canvas: Sorting stacking contexts
  html2canvas.js:2506 115ms html2canvas: Render queue created with 5 items
  html2canvas.js:2506 118ms html2canvas: Finished rendering
  html2canvas.js:2506 119ms html2canvas: Cropping canvas at: left: 72 top: 129.3125 width: 200 height: 330
  html2canvas.js:2506 119ms html2canvas: Resulting crop with width 200 and height 330  with x 72 and y 129.3125
  html2canvas.js:2506 121ms html2canvas: Cleaned up container
  html2canvas.js:2506 122ms html2canvas: options.onrendered is deprecated, html2canvas returns a Promise containing the canvas
  </code></pre>