HTML div to screenshot?

Question

I tried to google it, but without much success.

Here is my problem:
I have something like a drag-and-drop game in jQuery, where the user drags some items (div with img) to the droppable drawing area.

I need a screenshot of the users design so I can put all designs into a gallery page.

My problem is how to get the HTML code into a jpeg/png/gif/canvas/whatever.
Btw. I'm on a shared PHP hosting on the server side.

Answer 1

You're doing it wrong. Store each piece's location at all times in javascript, and then just submit that data and re-build the images/locations based on the passed javascript data.

Answer 2

The functionality you are describing is extremely complex to write with PHP - but there are services such as www.thumbshots.com or www.browsershots.com that do the same thing. This question has been asked similarly many times before here:

https://stackoverflow.com/search?q=screenshots+with+php