Dynamically Create Images?

[DalTXGuy1980]

Hello everyone,
I am working on a JavaScript based application, and I need to be able to dynamically create image object and display them on the screen after the page is loaded. Thus far I have found little success doing this and I was hoping that you somebody out there could tell me if it's even possible. Any input would be much appreciated.

[gil davis]

It would help to know what you've tried.

In order for an image to appear in the browser, there must be an image tag in the HTML. You can place an image tag where you want it to appear and use a transparent image as a place holder. They you can change the SRC of the image when you want to show the "dynamic" image, like they do for a rollover effect.

You can also use "document.write()", but depending on when you use it, you could wipe out the rest of your page.

You can also use "innerHTML" on newer browsers to insert an image tag where you need it.

[AdamBrill]

To know whether or not this is possible, I need to verify what you mean. :) If by image object you mean a img tag like this:

<img src="test.gif" width="10" height="10" alt="A test gif!">

Then yes, it is possible to dynamically create it. If you mean actually creating the gif(or other format), then no, it's not possible with JS. You can do that with PHP(and probably other server-side languages), but it's not possible with JS. If you meant the latter, you might be interested in this. (http://us4.php.net/manual/en/ref.image.php)

NOTE: This is not supported by all servers. You can check if your server supports it by running a phpinfo script.

[DalTXGuy1980]

Hi guys,
Thanks for the quick replies, and I appologize for any vaugeness in my previous post. The application I am working on contains a calendar with an expanding tree of events next to it. My client wants the users of the system to click on an event and have a "place holder" graphic placed under the mouse that the user and drag onto a calendar date.

I've managed to accomplish everything the client asked for, save being able to create multiple event place holder images. Right now what I am doing is exactly what gil davis suggested above, creating an empty image place holder for each event and then replacing the src attribute and moving the position to be under the mouse. My problem is, that if I want to added the same event to the calendar twice, I'm SOL since there is only 1 <img> tag loaded for that event in the browser. Do I have any other options here?

[gil davis]

Then for modern browsers, I stand by one of my other suggestion on innerHTML. You can also use DOM methods like appendChild().