Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!doctype html>
- <html lang="en">
- <head>
- <title>DOM to img test</title>
- <!-- https://github.com/tsayen/dom-to-image -->
- <script src="dom-to-image.min.js"></script>
- <style>
- #test {width:20em;background:yellow;padding:.5em;}
- h1 {color:red;font-family:"Comic Sans MS";}
- p {color:blue;}
- b {background:white;}
- </style>
- </head>
- <body>
- <div id="test">
- <h1>Test!</h1>
- <p>Just a <b>small</b> test</p>
- <input type="text" value="Foo" onchange="makeImg();">
- </div>
- <h4>Result:</h4>
- <script>
- var node = document.getElementById('test');
- function makeImg() {
- domtoimage.toPng(node)
- .then(function (dataUrl) {
- var img = new Image();
- img.src = dataUrl;
- document.body.appendChild(img);
- })
- .catch(function (error) {
- console.error('oops, something went wrong!', error);
- });
- }
- makeImg();
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement