PDA

View Full Version : Initialisation problems with adding a method to to animatedcollapse



Galaxiom
08-23-2012, 07:04 AM
Script: animatedcollapse

http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm

I added the following method to the animatedcollapse script.
It is designed to apply animatedcollapse to a number of divs following a naming pattern with a numeric suffix.
It simply loops through the addDiv method already in the script.


addDivs:function(substr, howmany){
for (i=0; i<howmany; i++)
{this.addDiv(substr + i, "fade=1,hide=1")
}
},
I call it in the page with code like:


<script type="text/javascript">
animatedcollapse.addDivs('collapse', 6)
animatedcollapse.init()
</script>
In the div, the call to the toggle method works.

<a href="javascript:animatedcollapse.toggle('collapse0')"<img src="img/down.png">heading text</a>
<div id="collapse0">collapse content</div>

However the rel does not work.

<a href="#" rel="toggle[collapse0]" data-openimage="up.png" data-closedimage="down.png">heading text</a>
<div id="collapse0">collapse content</div>

I prefer the rel to manage the up and down arrows and that works fine if the individual divs are set up line by line with the addDiv method.

What am I doing wrong?

Thanks

jscheuer1
08-23-2012, 08:46 AM
Works fine for me in Chrome. What browser are you using? In any case, if you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

Galaxiom
08-24-2012, 02:17 AM
The behaviour was the same in IE8, Chrome and Firefox.

I found the problem is the script will not work properly on any div whose ID contains the string "collapse".
Every other string I tried works fine.
I was just unlucky that I picked that as the substring of all the words I could have used.

Maybe it is something to do with collapse being a value of table border-collapse attribute but I am surprised that collapse as a substring of an ID caused trouble.

The behaviour is quite odd. If the div is set to be expanded when the page it opened it works perfectly until it is closed.
Then it will no longer respond.

jscheuer1
08-24-2012, 02:35 AM
It has nothing to do with style. The word collapse is used by the script, when you go to use it in a rel:


<a href="#" rel="toggle[collapse0]" . . .

It won't know whether to toggle or to collapse and might even lose track of the id . . .

Other off limits words would be 'expand' and 'toggle'.

Galaxiom
08-24-2012, 03:06 AM
Surely the square brackets are supposed to delineate the div name?

It shouldn't get confused. I would call it a bug.

jscheuer1
08-24-2012, 04:18 AM
I didn't write the thing. Um, one would hope so, but obviously not. I guess it's a bug, but probably not one worth worrying the author over.

As bugs go, it's easy enough to avoid.