CODEWITHSUNDEEP
javascriptimagecanvascopy
Ezio_
Ezio_

Reputation: 593

How to make a copy of image without src?

I have to make a copy of given image after it's loaded. The problem is that the image is not usin static url and the image is different each time, it's generated with php on the server side. The link keeps the same every time. What I have to do is to make a copy of this already loaded image. How can I do that using HTML5 and canvas, or is there any other way to do that? I know that it can be done with canvas, but I need the src of the image. The problem is that it's not a static url, and when I do it, I get another picture instead of the loaded one. Any ideas?

Upvotes: 1

Views: 1000

Answers (1)

Pointy
Pointy

Reputation: 413727

You can use a canvas; it's pretty simple:

<img src=http://placekitten.com/300/340 id=kitteh>
<canvas id=c></canvas>

JS:

var canvas = document.getElementById("c"), 
  kitteh = document.getElementById('kitteh'), 
  ctx = canvas.getContext('2d');

canvas.height = kitteh.height; canvas.width = kitteh.width;
ctx.drawImage(kitteh, 0, 0);

Upvotes: 4

Related Questions