start delay for Ultimate Fade-in slideshow

[simonzebu]

Ultimate Fade-in slideshow

http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

I want to feature four instances of slideshows on the page which works fine.
However, I would like to put a different start delay into each so that the images will change individually not all together but with the same delay between changes.

I thought I was on the right track by putting an extra parameter in the call
for startdelay:
new fadeshow(fadeimages3, 319, 229, 0, 4000, 1, "R", 4000);

then:

function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder, startdelay){

this.startdelay=startdelay

and further down:


if (iebrowser&&dom||dom) //if IE5+ or modern browsers (ie: Firefox)
setTimeout("document.write('<div id=\"master'+this.slideshowid+'\" style=\"position:relative;width:'+fadewidth+'px;height:'+fadeheight+'px;overflow:hidden;\"><div id=\"'+this.canvasbase+'_0\" style=\"position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'\"><\/div><div id=\"'+this.canvasbase+'_1\" style=\"position:absolute;width:'+this.fadewidth+'px;height:'+this.fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'\"><\/div><\/div>')", this.startdelay)
else
setTimeout("document.write('<div><img name=\"defaultslide'+this.slideshowid+'\" src=\"'+this.postimages[0].src+'\"><\/div>')", this.startdelay)

This caused an error with fadewidth and fadeheight not being defined, so I added:

this.fadewidth=fadewidth
this.fadeheight=fadeheight
at the start and commented out:
//var fadewidth=fadewidth+this.imageborder*2
//var fadeheight=fadeheight+this.imageborder*2,
adding "this." to the document.write

Now I'm getting error: picobj is null

Any ideas?

cheers

[jscheuer1]

You should almost never set a timeout on document write. If it were to be otherwise successful (no error like you are getting and no other errors), it would overwrite all of the page that had been parsed to that point in time by the browser - generally not desirable.

Other than that issue, it looks like you are basically on the right track. The only timeout you need is for the startit function, so after you did:



function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder, startdelay){

You should have just gone to these lines:


if (iebrowser&&dom||dom) //if IE5+ or modern browsers such as Firefox
this.startit()


and changed them to:


if (iebrowser&&dom||dom) { //if IE5+ or modern browsers such as Firefox
var cacheObj = this;
setTimeout(function(){cacheObj.startit();}, startdelay || 0);
}

[simonzebu]

Thanks for that J. Worked a treat :-)