0

I'm trying to build an interface for the user, so he can choose or pick colored eyes, skin, etc., of a model. I'm really on my way with divs and CSS. I'm using Ajax for loading images into the divs.

My problem is that I need to offer a option to the user so he can save the image as a JPEG or PNG file.

Looking around, I found canvas HTML5 stuff on Stack Overflow, but it's not compatible with Internet Explorer,

I need help to find something compatible with all browsers.

I also found this JavaScript code:

button = document.createElement("img");
button.src = "http://example.com/livechart.gif?interval=15"

But I don't know much about the createElement method.

I know CSS, but JavaScript is beyond my knowledge.

Community
  • 1
  • 1
Monclee
  • 146
  • 12

3 Answers3

0

You cannot do this on the browser, you must do it on the server.

see: Convert web page to image

Community
  • 1
  • 1
Diodeus - James MacFarlane
  • 112,730
  • 33
  • 157
  • 176
0

I believe you could do that with HTML canvas and some JavaScript: Canvas2Image : Saving Canvas data to image file.

Peter Mortensen
  • 30,738
  • 21
  • 105
  • 131
Hugo Cantacuzene
  • 85
  • 1
  • 7
  • Canvas can't render HTML, yet – Joe Aug 19 '11 at 16:30
  • everything is possible with javascript http://onepixelahead.com/2010/05/12/how-to-use-html5-canvas-with-ie6-ie7-and-ie8/ you might eventurn ie 6 in a good browser – Hugo Cantacuzene Aug 19 '11 at 16:34
  • jajaja well that would be great!!, thanks for your answers i need to be friendly with common browsers – Monclee Aug 19 '11 at 16:49
  • Man this is what i neeeed thaaaanks!! its a shame it wont work on IE =( http://www.nihilogic.dk/labs/canvas2image/ – Monclee Aug 19 '11 at 16:58
  • Thanks!!!!! http://onepixelahead.com/2010/05/12/how-to-use-html5-canvas-with-ie6-ie7-and-ie8/ – Monclee Aug 19 '11 at 17:04
0

You want to take screenshot of the browser? Well, there are lot of ways you could try, but all of them would be browser-specific. The most reliable would be to just tell the user to make a screenshot with the OS. On a Mac it's Command-Shift-4, then space; on a PC, it it's ALT-PrtScr, I think.

Michael Lorton
  • 43,060
  • 26
  • 103
  • 144
  • But that sucks.. i wont tell my user to use paint or somethig to cut the image of the div in the screenshot jajaja.. i just need to save a DIV of that html, as an image, with javascript or something. thats my question how.. i see a lot of apss, that saves the final result as an image.. how do the do it whit javascript? – Monclee Aug 19 '11 at 16:48
  • They *don't* do it with Javascript. Not only with Javascript anyway; they have sophisticated back-end systems for rendering the image. Just because something is possible doesn't mean it's easy. – Michael Lorton Aug 19 '11 at 19:13
  • well hope u people get happier.. if you see the next answer you can see what intelligence can do for people! thanks to user901215 for his answers.. – Monclee Aug 19 '11 at 20:40