PDA

View Full Version : Animated collapse Hide one div, show one div



intelligence
03-25-2011, 02:13 AM
1) Script Title:
Animated collapse

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

3) Describe problem:
Hi!

I'm trying to implent a functionality that will let me hide one div and at the same time another div becomes visible. I'm a javascript beginner so I don't really know how to solve it.

I tried with:
<div id="view"><a href="javascript:animatedcollapse.show(['hidden', 'hiddentext', 'hide']);animatedcollapse.hide('view')">View more</a></div>

And some other similar ones, but no luck..

atosoup
03-27-2011, 09:06 PM
HI, I am also trying to do this, Im sure it has something to do with groups but can not figure it out,

I have an image as a link I want one div to open and one to close when link is clicked,

Please if anyone can help with this it would be much appreciatedl.

atosoup
03-29-2011, 09:30 PM
Does anyone still check this forum section?

could realy use some help on this one.

ddadmin
03-30-2011, 07:42 PM
On the DD demo page, examples 4-6 should demonstrate this already. Basically, if you initialize a collection of collapsible DIVs as a group, opening one within it closes any previously open DIVs within the DIV. The way to initialize them as a group then is just to add the code in red to the initialization code:


animatedcollapse.addDiv('cat', 'fade=0,speed=400,group=pets')
animatedcollapse.addDiv('dog', 'fade=0,speed=400,group=pets,persist=1,hide=1')
animatedcollapse.addDiv('rabbit', 'fade=0,speed=400,group=pets,hide=1')

Where "pets" is an arbitrary but shared group name.

atosoup
04-01-2011, 06:07 AM
On the DD demo page, examples 4-6 should demonstrate this already. Basically, if you initialize a collection of collapsible DIVs as a group, opening one within it closes any previously open DIVs within the DIV. The way to initialize them as a group then is just to add the code in red to the initialization code:


animatedcollapse.addDiv('cat', 'fade=0,speed=400,group=pets')
animatedcollapse.addDiv('dog', 'fade=0,speed=400,group=pets,persist=1,hide=1')
animatedcollapse.addDiv('rabbit', 'fade=0,speed=400,group=pets,hide=1')

Where "pets" is an arbitrary but shared group name.

Thank you so much, When put in the way you did in this post it made pefrect sence! Had it all working like a dream in minutes, Thanks again, very much appreciated.

Dino77
08-16-2011, 08:39 AM
Thanks for the attempt to resolve the problem. I was able to clarify everything for myself. Partially though.