PDA

View Full Version : Programmatic dynamic image creation and display


sans-hubris
10-31-2003, 11:43 PM
I can't, for some reason, figure out a way of dynamically creating new images within JavaScript and then displaying them. I always end up resorting to writing out <img> tags, but I'd rather just make a call to the Image() constructor, perhaps attach it to the images array of the document, display it and be done with it, but no browser will do that for me.

Does anyone have any idea of how I can have images created dynamically as is needed from within JavaScript and display them anywhere necessary? I'd like to be able to do this so that I can delete those images after they're no longer useable.

The following is somewhat of a general idea of what I was trying to do. Some of the values are undefined because they are meant to be arbitrary. 'n' is just supposed to be a new array index for the document.images array.

var vis = "visible";
document.images[n] = new Image();
document.images[n].src = imSrc[n];

document.images[n].style.pixelLeft = xPos;
document.images[n].style.pixelTop = yPos;
document.images[n].style.visibility = vis;

The above obviously does not do what I would want it would do, but it's a general idea of what I want.

And yes, it must work in multiple browser (well, at least Mozilla/Gecko, IE, Opera, and hopefull Konqueror/Safari.)

Grr, I don't like JavaScript. It's behavior is completely inconsistent, especially across browsers.