Slide up, slide down ion-content

I’m trying to add a custom bar on top of the ion-content. When it appears it should slide down, smoothly pushing the ion-content down to make space for itself. When it goes back it should slide up, bringing the ion-content back up smoothly.

I’m using animate.css for some of the animations. It doesn’t work properly for this scenario as ion-content will be pushed down before the slidedown animation begins.

What is the recommended way to do this in ionic?

Hope this image helps to understand what I’m trying to do.


Hey @maggie001,

have you ever figured out a solution?


It’s not a good solution in my opinion, but right now I’m adding a class which animates the height from 0px to the 50px (the height I want it to be) and removing the class to animate it from 50px to 0px.