Div Clone

by JQ Purfect

HTML

<div id="mydiv">
    <img src="/img/logo-white.png" />
        <p>text!</p>
</div>
<br><br>
    
    <button id="go">Go</button>

<script src="http://html2canvas.hertzen.com/build/html2canvas.js"></script>

CSS

#mydiv {
    background-color: lightblue;
    width: 200px;
    height: 200px
}

JavaScript

$("#go").click(function() {
    alert("Clicked");
    saveVideo();
});

function saveVideo() {
html2canvas([document.getElementById('mydiv')], {
    onrendered: function(canvas) {
       document.body.appendChild(canvas);
       var data = canvas.toDataURL('image/png');
       // AJAX call to send `data` to a PHP file that creates an image from the dataURI string and saves it to a directory on the server
    }
});
}