hundreds of images download a little slow - Page 2

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View

Re: hundreds of images download a little slow


This message is a follow-up on the earlier posts that I send in the last few
days, while I was trying to puzzle together a map. I
have cross-posted this to comp.lang.JavaScript, as I also asked some questions
there relating to this map and most of the map is
done in JavaScript (any comments greatly appreciated).

The culprit was Photoshop / image ready.  I wanted to make a funky map with "on
mouse overs" for about 40 regions.  So Photoshop
decided to slice it up..... BIG mistake.  Yes, most of the images where only
about 100bytes or so (gifs with few colours are indeed
very small).

No, I did not have them in a table that slowed things down.  But YES, it was a
stupid idea.  On my high speed internet connection
(4mb/s) it took about one minute to download, just as long as it took for my
friend on a 56k. modem!  Interesting.  Once, I set my
firefox to multiple pipe (or whatever that is called), it went a lot faster
though (thanks for the tip).

Anyway.  I have devised a different way now for those 300 images...  To see the
results, please visit:

I am pleased with the result, as it is a very interactive map that does not
require MacroMedia's Flash, that should be quick to
download (images are only about 25Kb) and that allows for people without
JavaScript to just tick the boxes.  Also, it is easy to
maintain, as each region has its own small gif and no fancy position is required.

To make those small gifs, I used Photoshop, where I created a map with extra
layers for each "onmouseover" image.  I then saved each
layer individually as gif with only three colours (dark yellow, light yellow and
transparency).  I also cropped the image so that it
only went from the NE corner to as far as it needs to go.   Then, I got the
co-ordinates for the image map from image ready. The
images are named 0 to 40.gif.

If anyone wanted to see the original (with the (almost!) 300 images, then have a
look at:

Thank you all for your comments.


Re: hundreds of images download a little slow

Just a quick note: you should be using 'onclick' rather than
'onmousedown'. To see why, click on a checkbox, and then 'pull off'
while holding down the button. Difference between the raw ''mousedown'"
and the semantic "click".

Also, you might want to loop all those onclick handlers on page load,
otherwise the page may load with boxes checked and no areas

var el, n = 1;
while (el = document.getElementById('r' + n++))
 if (null != el.onclick)

//assuming ids start at 'r1'

Some flickering in IE; might want to control event bubbling.

Re: hundreds of images download a little slow

Ugh...make that:

if (null != el.onclick && el.checked)

Re: hundreds of images download a little slow

Quoted text here. Click to load it

Thank you Rob,

I noted both those problems, but it would have probably taken me a good year to
work out what was wrong and how to fix it, so I am
stoked with your note.

Site Timeline