Screenshot of hidden div using html2canvas

Question

How to take screenshots of a hidden div? The code given below is not working for hidden div.

HTML

<div id="mydiv" style="display:none;" >    <p>Text</p> </div>  <div id="canvas" style="display:none;"> <p>Canvas:</p> </div>   <div id="image">    </div> 

SCRIPT

<script>   var elem = $('#printDiv');         html2canvas(elem, {             onrendered: function (canvas) {                 var data = canvas.toDataURL('image/png');                 var image = new Image();                 image.src = data;                 document.getElementById('image').appendChild(image);             }         });  </script> 

It works when we set the style of the div "mydiv" as 'display:block'.

Answer 1

html2canvas(mydiv, {     onclone: function (clonedDoc) {         clonedDoc.getElementById('mydiv').style.display = 'block';     } }).then((canvas)=>{ //your onrendered function code here })