Help needed for drop-in slideshow (first timer)

[anneharrigan]

1) Script Title:drop-in slideshow

2) Script URL (on DD): ?

3) Describe problem:

Hi, this is my very first time trying something like this, I have always used the design mode in Dreamweaver. It worked great when previewing on my computer, but when I uploaded it to the web it doesn't see the images. I can tell it's trying to drop in pictures it can't find.

Here's the website www.musiccenterscmi.com

Here's what I put in the html code.

//Define Image Array. Syntax: ["image_path", "url_destination", "url_target"]
var myimages=new Array()
myimages[0]=["images/top image.jpg", "", ""]
myimages[1]=["images/top image bcso.jpg", "", ""]
myimages[2]=["images/top image cms.jpg", "", ""]

//Create new drop-in slideshow
//Syntax: new dropinslideshow(image_array, slideshow_width, slideshow_height, delay_before_rotation)
new dropinslideshow(myimages, 800, 206, 5000)

</script>

Thanks so much for your help,

Anne

[jscheuer1]

Upper and Lower case matter on the web and spaces really shouldn't be used in filenames. But if they are, they should be replaced in your code with %20 when possible. This worked:

//Define Image Array. Syntax: ["image_path", "url_destination", "url_target"]
var myimages=new Array()
myimages[0]=["images/Top%20Image.jpg", "", ""]
myimages[1]=["images/Top%20Image%20BCSO.jpg", "", ""]
myimages[2]=["images/Top%20Image%20cms.jpg", "", ""]

[anneharrigan]

Thank you, John, you're a miracle worker! I did one better and fixed my image filenames.

Anne

[anneharrigan]

OK, so here's my next question:

Is there a way to slow down the speed of the "drop"?

Anne

[jscheuer1]

Go into the dropinslideshow.js file with notepad or another text only editor and edit the lines (red in the below) as indicated/desired:

function dropinslideshow(imgarray, w, h, delay){
	this.id="_dropslide"+(++_dropinslideshowcount) //Generate unique ID for this slideshow instance (automated)
	this.createcontainer(parseInt(w), parseInt(h))
	this.delay=delay
	this.imgarray=imgarray
	var preloadimages=[]
	for (var i=0; i<imgarray.length; i++){
		preloadimages[i]=new Image()
		preloadimages[i].src=imgarray[i][0]
	}
	this.animatestartpos=parseInt(h)*(-1) //Starting "top" position of an image before it drops in
	this.slidedegree=10 //Slide degree (> is faster)
	this.slidedelay=30 //Delay between slide animation (< is faster)
	this.activecanvasindex=0 //Current "active" canvas- Two canvas DIVs in total
	this.curimageindex=0
	this.zindex=100
	this.isMouseover=0
	this.init()
}

Let me clarify, just in case:

this.slidedegree=10 //Slide degree increment size (a larger number is faster, a smaller number is slower)
this.slidedelay=30 //Delay between slide animation increments (a smaller number is faster, a larger number is slower)

[anneharrigan]

Thank you, John, that worked perfectly!

Anne

[chipc]

Very nice website Anne!

[anneharrigan]

Thanks! On some of the other pages (under the symphony) I have the photos changing on refresh. I'm trying to stick my toe into the dark side of Dreamweaver (the code side )

Anne