I'm trying to create a card with some text/images inside, which can expand down and expose more content if a user clicks on the expand button (a huge down arrow).
The natural way to do this obviously would be to append the additional content to the part of the canvas that expands down.
However, in my case the entire content of the card will actually get re-arranged. This means the content in the original smaller card area when contracted, will change when expanded.
What is the best way to make this happen? The card is in a web page.
I'm thinking of doing it like this:
- Card expands down.
- Old content fades out, and new content fades in.
Does this sound right? Or are there better ways of doing this?