Ultimate Fade-In won't run

[Gberman]

1) Script Title: Ultimate Fade-In Slideshow (v2.1)

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

3) Describe problem: After successfully running Translucent slideshow, I can't get this script to run. All I see is the user controls. I hope someone will look at the script and help me.

http://www.loxahatcheefriends.com/20...onference.html

The JPEGS and the .js file are in the same folder as the page with the script.

TIA
George

[jscheuer1]

Here in your source code for the page you have two syntax errors (highlighted, with missing commas inserted in red):

<script type="text/javascript">

var mygallery=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["DSC_1814.jpg", "", "", "Evan Hirsche, President, National Wildlife Refuge Association delivers keynote address"],
		["DSC_1817.jpg", "", "", ""],
		["DSC_1819.jpg"],
		["DSC_1822.jpg", "", "", "Dudley Edmondson, wildlife photographer. “Connecting with Nature” 
Photo journalist on the River of Grass Canoe Expedition
"] //<--no trailing comma after very last image element!
	],
	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "ondemand",
	togglerid: ""
})


var mygallery2=new fadeSlideShow({
	wrapperid: "fadeshow2", //ID of blank DIV on page to house Slideshow
	dimensions: [600, 400], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["DSC_1814.jpg", "", "", "Evan Hirsche, President, National Wildlife Refuge Association delivers keynote address"],
		["DSC_1817.jpg", "", "", ""],
		["DSC_1819.jpg"],
		["DSC_1822.jpg", "", "", "Dudley Edmondson, wildlife photographer.Photo journalist on the River of Grass Canoe Expedition
"] //<--no trailing comma after very last image element!
	],
	displaymode: {type:'manual', pause:2500, cycles:0, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "always",
	togglerid: "fadeshow2toggler"
})

</script>

There could also be other problems. Fix those and we shall see.

[Gberman]

Thanks, John. You have an eagle's eye!

But, fixing the commas didn't solve the problem. What else?

Please use fixed address:
http://www.loxahatcheefriends.com/20...onference.html

Thanks.
GRB

[Nile]

Change:

		["DSC_1822.jpg", "", "", "Dudley Edmondson, wildlife photographer. “Connecting with Nature” 
Photo journalist on the River of Grass Canoe Expedition
"] //<--no trailing comma after very last image element!

To:

		["DSC_1822.jpg", "", "", "Dudley Edmondson, wildlife photographer. “Connecting with Nature” "+
"Photo journalist on the River of Grass Canoe Expedition"+
""] //<--no trailing comma after very last image element!

[Gberman]

Thanks, Nile. Something in your comment brought to my attention that I'd used double quotes within double quotes. Getting sloppy, I guess. Soon as I put the internal text in single quotes, everything worked.

Next (last?) question: How do I center the portrait-mode photos so they align with the captions?

[jscheuer1]

Get rid of this from your stylesheet:

.centered {	text-align: center;}

Replace it with this:

.descpanelfg {
	text-align: center;
}

[Gberman]

I must have done this wrong. I don't want to lose ".centered" from my global CSS file, so I put .descpanelfg in an internal stylesheet, and then replaced "centered" in the code.

That didn't help.

[jscheuer1]

I still see this:

<td class="centered" style="width: 649px"><div id="fadeshow2" class="centered"></div>

in your source code. You will have to remove those and add this rule:

.descpanelfg {
	text-align: center;
}

[Gberman]

Sorry, John, I forgot to publish after viewing locally. Now can you see why the portrait photos aren't centered?

Also, is there a way to change the background color?

[jscheuer1]

Get rid of (highlighted):

<div id="fadeshow2" class="descpanelfg"></div>

You can change the background color with (add to your stylesheet):

#fadeshow2, #fadeshow2 .gallerylayer {
background-color: green!important;
}