Ultimate Fade-in slideshow: No show until page loads

[cgehringer]

Ultimate Fade-in slideshow (v2.4)
http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

I have a page that contains a lot of HTML, Flickr slide shows, other javascript, images, etc. My issue is:

When my browser cache is empty (or one of my visitors is coming for the first time) the Ultimate Fade-in slideshow does not display the DIV and images until the entire page has loaded.

Can I fix this so the images load sooner?

I tried putting an IMG into the DIV but it quickly gets removed / the div goes away.

Perhaps different speed Internet connections will see things differently. I'm on a slower DSL. Note: I understand some of the IMGs are a little big.

Problem page:
http://stjoeshsalumni.org/
or
http://cherokeealumni.org/

[jscheuer1]

On St Joe, change this:


<div id="fadeshow1" style="text-align:center;"></div>

to:


<div id="fadeshow1"></div>

There's no text in there, and that style might mess up the images' alignment in some browsers.

In the stylesheet put:


#fadeshow1, #fadeshow1 .gallerylayer {
background-image: url(/school_files/SJ-IHMAlumni/LongPhoto/long_photo.jpg);
width: 810px;
height: 300px;
}

And here, make the highlighted changes:


<script type="text/javascript">
var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [810, 300], //width/height of gallery in pixels. Should reflect dimensions of largest image //height will be programatically changed in fadeslideshow.js based on height of first image in folder



imagearray: [
["/school_files/SJ-IHMA . . .