ingram-projects/animxyz

Animate Height change in vue

ricky11 opened this issue · 1 comments

I know that you cant really animate hiehgt, width changes performantly, but how would i go about a simlpe div that expands based on the content inside of it.

For example in Vue.

I have a

{{content}}

i would like to the container to animate growing to fill {{content}} based on the condition.

Suggestions?

We don't support this out of the box with AnimXYZ, but you can do it with CSS transitions and max-height as described in this article: https://css-tricks.com/using-css-transitions-auto-dimensions/

If you want more precise/accurate transitions you can change the resulting max-height value with JS to match the height of the {{content}}.