Multiple Instances of the same image

How do you download an image once but display it in 10 different places on the html page?
lankfordAsked:
Who is Participating?
 
johnny99Connect With a Mentor Commented:
Your question:

     "How do you download an image once but display it in 10 different places on the html page?"

you're saying that you asked the right question and the other guy gave the wrong answer?

For god's sake.

You asked the wrong question.

Also, you think .BMP is a web format? How about you give up now and save us all the embarrassment...
0
 
MorFFCommented:
The browser does it automatically.
You can put 10 (or any number really) <IMG> tags, all pointing to your image.  When the page displays, it will download the graphic and display all at the same time (well pretty near the same time).

Cheers - MorFF
0
 
lankfordAuthor Commented:
Thanks, but I need a real answer to this question.  I understand how the browser works.  I am using CSS, however, and it forces a reload of a graphic every time I reference any *other* style.  My point being, graphics are loading all the time when it would be much better if the graphics could simply reference a one-time loaded object somewhere else on the page.

I have tried using the <OBJECT> element but am not having any luck making it actually render a graphic.

lankford
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
johnny99Commented:
Lankford, you asked a question, and MorFF answered it perfectly correctly, so technically you owe MorFF the points.

But now that you've posted a more comprehensive question, I have to say "huh?"

I don't understand what you mean by "I am using CSS, however, and it forces a reload of a graphic every time I reference any *other* style." It's a mystery to me.

Please say what you're trying to do, which browser, show us the code, and tell us in what way you're using CSS  and images together.

0
 
lankfordAuthor Commented:
MorFF didn't answer it at all.  I asked a very deliberate question.  Saying that the browser pretty much takes care of it doesn't do a thing for me.  Owe him the points?  Please.  I could write a browser that doesn't have a cache at all.  What then?

As far as what I'm doing, I'm changing the graphic on list items using a style like the following:

<style type="text/css">
      .styleName {list-style-image : url("http://www.whatever.com/images/image.bmp");color : Black;}


I have used the onmouseover and onmouseout events to change the color of the list item text.  This produces a highlight affect.  

My problem is that accessing the style to change the text to 'blue' causes the browser to load the list item graphic again.  I assume that this is the implementation used my Microsoft (IE 5) for CSS, but may be the same in Netscape.  If you reference anything from the style object (event.srcElement.style.color), the entire set of style information is apparently reloaded.  You can actually watch the status bar as the browser makes a request for the graphic again.

This really sucks as you move over list items since the graphics are constantly reloading (for no real reason).  If I, instead, can associate another instance of the same image somewhere else on the page, then I don't have to worry about this.  Even if the browser does want to redraw the graphic, it is found locally on the page and will render it immediately (and hopefully imperceptibly to the user).

Does this make any sense?  Locally, of course, everything works fine.  I had to go to other machines to observe this behavior.

lankford
0
 
kikkertmCommented:
I recognise this behaviour, I had the same problem. Didn't actually found a solutions when I did the site, but later I thought of one that could work. Didn't test it though...
Put the image (image.bmp) somewhere else in the page (so not referenced in the style sheet, and just make it's width en height zero ! ?! ?

<img src="http://www.whatever.com/images/image.bmp" width="0" height="0">

not sure, but might work..
0
 
lankfordAuthor Commented:
johnny99

You stupid (Edited by Computer101).  Maybe you haven't noticed, but you can have some bmps that are smaller than their equivalent gifs.

Don't you have anything better to do than hang out in other people's questions and try to teach them manners?  Get a life.

0
 
lankfordAuthor Commented:
In fact johnny, I'll give you the points.  Thank you so much for helping me out.
0
 
MorFFCommented:
Well, you try to help and all you get is abuse...

And then the points get awarded for no reason...

Ain't life a bitch!
0
 
johnny99Commented:
Well I think we've all learned something from this experience.

I've learned that lankford is rude and inarticulate and knows nothing about web publishing.

MorFF has learned that when you try and help lankford you get insulted, so we won't bother to try in the future.

And lankford has learned -- oh yeah, sorry, lankford *hasn't* learned anything. According to him he's capable of writing new web browsers in his spare time, but he can't seem to understand that:

     How do you download an image once
     but display it in 10 different
     places on the html page?

isn't the same as the *real* question which is a complex one about style sheets which it took him over two hundred words to explain later on.

If you're too inarticulate to ask the real question then you could at least apologise when you get given the right answer.

Also I think that EE management should learn something about this behaviour...

MorFF, you can get your richly-deserved points at HTML question Q_10293911.html
0
All Courses

From novice to tech pro — start learning today.