Make an animation when height auto change

Asked May 10 '21 at 03:26

Active May 10 '21 at 14:55

Viewed 44 times

I am trying to make my div have animation when it have different height and when I click to Agreement it will have different height.

How can I achieve the animation slide up and slide down depends on height of the div?

edited May 10 '21 at 14:55

asked May 10 '21 at 03:26

Nhan Nguyen

1

What animation? I mean what kind ? What are you gonna animated ? – Kerry May 10 '21 at 03:29
2

It's difficult to answer this question without more details, but you may want to look into [CSS transitions](https://www.w3schools.com/css/css3_transitions.asp). – Quelklef May 10 '21 at 03:32
Like it slide up and slide down when height change – Nhan Nguyen May 10 '21 at 03:36
Use CSS property `transition ` it will make it animated. Example `transition :0.5s `. – Prateek Chaubey May 10 '21 at 05:48
Do i need to do some transition-property: height or something? – Nhan Nguyen May 10 '21 at 05:59
Anyone know how I can achieve the animation? – Nhan Nguyen May 10 '21 at 14:54
You are not changing the height , You are changing contents of the div#team-management-tab-panes , Apart from that height between auto and numbers can't be animated . You would need to use max-height for that https://stackoverflow.com/questions/3508605/how-can-i-transition-height-0-to-height-auto-using-css?noredirect=1&lq=1 – Waqas Tahir May 10 '21 at 16:17
One way to do this is to calculate full height by summing up the height of elements in the list and then transition from 0 to that height but its not the best solution – Waqas Tahir May 10 '21 at 16:25
So what is the best solution in this case? – Nhan Nguyen May 10 '21 at 16:44
Anyone know the best way to implement this? – Nhan Nguyen May 11 '21 at 04:20

0 Answers0