i have a div element with dynamic HTML elements inside of it, and i want to take a screenshot for that element and store it to disk as image, using javascript and JQuery?
can that be done? thx!
2 Likes
It’s not possible to access Disk resources of the client Browser host computer. i’d suggest doing that through some Server side solution.
1 Like
I don’t think that is possible at all. as internet browsers don’t give Javascript access to local files. so no way Javascript can read or write from/to a file in the client’s PC. but instead the only solution you have is to do that in your server side, if you use PhP or ASP.NET that is very possible you can take a snapshot for that div element using Asp.net then let the client to choose where to save that image file using a FileSave dialog or store it in server side.
1 Like
As the previous answer, NOPE, it’s not possible to take a snapshot of an element in an HTML page using Javascript or any other client side platforms. as you should know client side code of any website doesn’t have access to the user’s computer, so even if you successfully took a screenshot for that element you wont be able to save it to disk.
i suggest that you do that using server side programming languages, such as PhP and Asp.NET.
Sure. Use this: html2canvas, generate a file from the resulting canvas, and give the user a link to download the file.
4 Likes
using html2canvas really sounds like a perfect solution to this issue, you can simply call the library like:
html2canvas(element, {
onrendered: function(canvas) {
// handle the rendered canvas (screenshot) in here in anyway you like.
}
});
It’s fairly a single method and one event handler.
thanks @programcsharp I personally didn’t know html2canvas (such a thing) existed before reading your post 
2 Likes