/    Sign up×
Community /Pin to ProfileBookmark

Display an image object without an <img> tag?

Copy linkTweet thisAlerts:
Aug 13.2003

Sorry that’s my second thread on that topic. I try to use an array of Image objects to preload images in memory; and i’m facing a behavior i was not expecting on the navigator side (not exactly the JS side exactly).

In my document, i create JS generated <img> tags, attached as innerHTML to dynamically created DIVs.

I have a pre-loaded array of Image objects, and i want to use this array to change the SRCs of the images in my document.

Code would be something very usual, like :

document.images[key].src = myImageBank[key2].src;

The code works, but the navigator (IE6) acts weird : instead of affecting the src to my document.images AND actually changing the image; it will just affect the src, then *attempt to load the image from the internet* and eventually end up with a Image.onerror event (thanks for the tip, i’ve identified that!) whereas the image is available and already succesfully loaded in my array.

Why would he load the image from the net in the first place? It is supposed to have it available in memory?
Would it have something to do with the fact that i manipulate JS created tags?

So is there a way to directly display my Image objects in my document, without creating an <img> tag for this purpose?

Thank you for your help! ?
Caz

to post a comment
JavaScript

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@Khalid_AliAug 13.2003 — you can se the image to as background for any div element,however,Id say post the the link to the page thats causing this problem so that some one can take a look.

Else you can always put all the resources in a zip file an upload it
Copy linkTweet thisAlerts:
@CazauthorAug 14.2003 — Thank you for your attention!

Here are the links :

http://cdecas.free.fr/dhtml/

http://cdecas.free.fr/dhtml/newgame1.zip

The script is to be tested in IE5/6

Warning, it's a huge script that does more than just the image thing.

some explainations will help :

the first link illustrates how the script behaves when online.

It will generate 5 alert boxes matching the 5 "image.onload" events for the 5 images in the preload array.

Then the program will continue, and eventually, you'll get another alert box, indicating there's an image.onerror event for the main (player) image.

Also, one can see in the status bar the the scripts is trying to download the image from the net.

The second link is the zip file. Test it as a local page, and you'll get the 5 initial alert boxes (image array properly loaded - i've noticed the 5 boxes appear in a different way, too); but then, the program will run as expected, the main image (player sprite) will be display, and there's won't be an image.onerror event.

Quite puzzled with this....

Thank you for your help!

Caz
×

Success!

Help @Caz spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.15,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...