Fadeinslideshow.js

[tylergrote]

1) Script Title: Fadeinslideshow

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...nslideshow.htm

3) Describe problem: I know this problem is on my site, because I've got some pretty big images. But is there a way to incrementally preload the images in the slideshow so that my page doesn't take as long to post?

link to my page: http://www.cjgengineers.com

[jscheuer1]

The script already does an incremental preload. To speed things up further, optimize your images, all of them on the page including rollovers, not just the ones in the slideshow.

[mattmac]

Is there a way of pre loading the first slide.

In the past I have gone into the js script and line 53 allows you to set hex value of background. Can this be set as an image rather than a colour.

I have a subtle image as part of a background and it looks a bit clumsy while waiting for the first slide to load.

[jscheuer1]

Is there a way of pre loading the first slide.

In the past I have gone into the js script and line 53 allows you to set hex value of background. Can this be set as an image rather than a colour.

I have a subtle image as part of a background and it looks a bit clumsy while waiting for the first slide to load.

No need to edit the script. And you shouldn't because if you have two pages that use it and want different backgrounds, you need two scripts.

Anyways - say your wrapperid is fadeshow1. Put this or something like it in the head of the page (or put its rules in an existing stylesheet):

<style type="text/css">
#fadeshow1, #fadeshow1 .gallerylayer {
	background: green url(myimage.jpg) !important;
}
</style>

Substitute the wrapperid for fadeshow1, if different. The color and the image may be of your choosing. A path may be specified for the image. If relative, the path will be relative to where this rule is. Like if it's on the page, relative to the page. If it's in an external stylesheet, relative to that stylesheet.

If doing just color, use like:

<style type="text/css">
#fadeshow1, #fadeshow1 .gallerylayer {
	background-color: green!important;
}
</style>

Use whatever color (color name, hex code, etc.) you like.

In both examples the highlighted !important keyword is required to override the scripted styles.

[mattmac]

Hi John

Thanks for the help. This is something I have always wanted to solve.

It makes a big difference and I will be changing all my sites to work this way.

Thanks again