Results 1 to 2 of 2

Thread: animated collapse using master and content pages

  1. #1
    Join Date
    Aug 2008
    Posts
    10
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default animated collapse using master and content pages

    1) Script Title: Animated Collapsible DIV v2.4

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...e.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>

  2. #2
    Join Date
    Aug 2008
    Posts
    10
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    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.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •