Accordion Content problem

[vanhorn]

1) Script Title: Accordion Content script (v1.6)

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

3) Describe problem: The content is being hidden and exposed, and the background color is showing up on the header that the mouse is over, but the correct content is not being revealed.

Here is the page:
http://www.deardaddy.com/our_story.php

When the page is opened, the second section is expanded, and I don't want any to be. (I can live with the last one contacted being open, but I don't want anything open to start with.) When I mouse-over the first item (Foreward), the second item (Prologue) expands.

When I mouse over the second item, the fourth item (Chapter 2) expands, a pattern that continues as far as I have coded for this script. (Chapter 5)

I can't see any way to get the third item (Chapter 1) to open at all.

Note that the first item doesn't have any content to expand, but there is an empty thepet div there, and inserting text in that div doesn't change the behavior anyway.

I can't see anything that I've messed up, am hoping that fresh eyes will see whatever silly error I've introduced.

Van

[ddadmin]

First and foremost, you should turn persistence off if you don't want any particular content to be expanded when the page loads:

	onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
	animatedefault: false, //Should contents open by default be animated into view?
	persiststate: false, //persist state of opened contents within browser session?

Let us know what other issues you have once that's done.

[vanhorn]

Okay, I've made that change and it doesn't seem to make much difference. It is cleaner when you go to a chapter and come back to the summary, as everything is closed. However, you still expose the contents of Chapter 5 by hovering on Chapter 3, and there is no way to expose the contents of Chapter 1.

Van

[Snookerman]

That's because the fist div has the wrong class:

<div headerindex="1h" class="mypets"></div>

Change it to this:

<div headerindex="1h" class="thepet"></div>

Good luck!

[vanhorn]

Bingo! As that div wasn't visible, I wasn't paying enough attention to it. I guess the logic depends on the two styles alternating, so the third thepet div goes with the third mypets div, and if you get the names wrong it will have exactly this effect.

Thank you for spotting that.

Van

[Snookerman]

You're welcome, sometimes all you need is a pair of fresh eyes. You can go to your first post in this thread, click then Go Advanced and add the Resolved prefix to the thread title. This will let other users know the problem has been solved.