animated collapse using master and content pages

[akmporter]

1) Script Title: Animated Collapsible DIV v2.4

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm#newattrs

3) Describe problem:

I have very much enjoyed using the animated collapse. At the moment I am using it in my master page as part of my menu. It is working very well. Now I would also like to make use of this functionality on a few of my content pages but not all. I attempted to add the DIVs in my content page but it is not working. Is it possible to use in this way?

Here is what I have in my master page btwn the head tags:

<script type="text/javascript" language="javascript" src="scripts/animatedcollapse.js"></script>
<script type="text/javascript">
animatedcollapse.addDiv('menu-expand', 'fade=1, height=80px, persist=1')

animatedcollaspe.addDiv('afterPic','fade=1, group=aaron, persist=1, hide=0')
animatedcollapse.addDiv('beforePic','fade=1, group=aaron, hide=1')

animatedcollapse.ontoggle=function($, divobj, state){ }

animatedcollapse.init()
</script>

And in my content page in the content placeholder:

<a href="#" rel="toggle['afterPic']" title="blank.png" rev="after.png"><img alt="" src="blank.png" style="border: 0px" /></a>
<div id="afterPic"><img alt="" src="after-aaron.jpg" /></div>

<a href="#" rel="toggle['beforePic']" title="blank.png" rev="before.png"><img alt="" src="before.png" style="border: 0px" /></a>
<div id="beforePic"><img alt="" src="before-aaron.jpg" /></div>

[akmporter]

I was able to get this to work by adding this code in the content page:

<script type="text/javascript">
animatedcollapse.addDiv('aaronAfter', 'fade=1,speed=600,group=aaron,hide=0,persist=1,')
animatedcollapse.addDiv('aaronBefore', 'fade=1,speed=600,group=aaron,hide=1')

animatedcollapse.ontoggle=function($, divobj, state){ }

animatedcollapse.init()
</script>

Seems a little repetitive but it works. Sorry for the inconvenience.