So I recently needed to create a image from a part of a webpage (html) after a short googling I found a nice library, html2canvas, that can render a part of the dom as a canvas element, complete with all css properties. So that's a good start but I needed some way of making the image downloadable too. Turns out the canvas element has a function called toDataURL that returns the rendered content of the canvas as a data-url. The url can then be used with a <a> tag to create a download link. So the complete example looks something like this.
This works fine in Chrome & Firefox whoever not in Internet Explorer, in IE a small hack is needed. Due to 'security' reasons IE doesn't allow data urls in <a> tags so instead you need to decode the data from the canvas and create a blob object that can be passed to the window.navigator.msSaveOrOpenBlob function.
Guess there's better ways to detect if IE is present and most of the data-url to blob stuff should be replaced with a toBlob call once it's supported.