CODEWITHSUNDEEP
cssangularaccordion
iBlehhz
iBlehhz

Reputation: 586

Animate ngb accordion

Hi I would like to know if anyone knows how to animate ngb accordion? My code looks something like this but it doesn't work. 

/deep/ .my-accordion .card-body {
max-height:0;
overflow: hidden;
transition:max-height 2s;
}

/deep/ .collapse.show{
max-height: 5em;
}

Update

I just changed the whole thing to primeng accordion instead. Apparently it has animations with it already :P

Upvotes: 4

Views: 1370

Answers (1)

Wayne Kaskie
Wayne Kaskie

Reputation: 3483

I have something similar and the missing piece is to add the

[destroyOnHide]="false"

attribute. Otherwise, the elements are pulled from the DOM so won't animate.

I also set the top/bottom padding to 0 when hidden, due to the change above. Alternatively, you could change the box-sizing.

Upvotes: 1

Related Questions