There seems to be a standard page transition animation where content slides upward as it becomes visible. I have a navbar component that sits in the header of all my core pages, like:
<ion-header> <app-navbar></app-navbar> </ion-header>
The navbar participates in the transition animation, it slides up as with the rest of the content. My feeling is that it should remain fixed.
I can think of two possible solutions:
- Place the navbar somewhere where it exists outside of the transition (
- Something else (configuration I’m unaware of, or wrapping the navbar in some special element that exempts it from transitions)
I have tried placing the navbar at various positions in
<ion-header> <app-navbar></app-navbar> </ion-header> <ion-app> <ion-router-outlet></ion-router-outlet> </ion-app>
In that case the navbar remains visible and does not transition, but content is hidden underneath it.
app-navbar in an
ion-toolbar does not prevent the navbar from appearing in the transition or from covering page content (if the navbar is in
How can I prevent content in the header from participating in the page transition animation?