Load page with one image first then display entier gallery?

[medlington]

Hi,

I've just made a site and the main focus of it is a gallery of images which are all quite large, there are over 100 images all between 50 - 100k and the problem Im having is that my client is having trouble viewing the site on her blackberry. Im pretty sure that this is because the page is trying to load all of the images before it displays the site. She can connect to it intermittently but occasional it does say 'site too large'.

Here is a link to the site:

http://jopriceflowers.co.uk/

Im thinking that I should be able to put one of the images in a div in the middle of the site and then through javascript tell it to swap the div for the one containing my gallery when the page has loaded. My theory is that the initial page should load on her phone before it tries to load all of the other images.

I rarely touch javascript but I plan to use something like onload='swapdiv()' in the body tag and then the swapdiv function just changes display to 'none' on the visible div and to 'block' on the hidden one.

Should this work or will it still try to load the content from the div containing the gallery even if display is set to none?

Can anyone think of any different ways to do this?

Thanks

[TheGAME1264]

If display is set to none, it still will load the image in the gallery. Whatever's in the HTML code for images will be loaded.

What you CAN do as a compromise is to preload the images after the rest of the page has loaded, or at least load say 5 of them and then load the rest up into an array. Mind you, you could still end up with that error, so you may have to load them on the fly.

[medlington]

I thought it may still try to load the content even if display was set to none, oh well back to the drawing board. I'm going to ask a few people to test out the site first to see if its just an issue with her device before I try to find a solution.

Thanks for the reply