Ionic 4 Old page overlays over current page after navigation
See original GitHub issueBug Report
Ionic Info
Run ionic info
from a terminal/cmd prompt and paste the output below.
Ionic:
ionic (Ionic CLI) : 4.1.2 (/home/prasun/.npm-global/lib/node_modules/ionic)
Ionic Framework : @ionic/angular 4.0.0-beta.3
@angular-devkit/core : 0.7.4
@angular-devkit/schematics : 0.7.4
@angular/cli : 6.1.4
@ionic/ng-toolkit : 1.0.6
@ionic/schematics-angular : 1.0.5
Cordova:
cordova (Cordova CLI) : 8.0.0
Cordova Platforms : android 7.0.0, browser 5.0.4
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.2, cordova-plugin-ionic-webview 2.0.2, (and 9 other plugins)
System:
Android SDK Tools : 26.1.1 (/home/prasun/Android/Sdk)
NodeJS : v8.12.0 (/usr/bin/node)
npm : 6.4.0
OS : Linux 4.15
Describe the Bug After a few page navigations, when I navigate to the home page using angular’s router navigate, one of the following things happen:
- The navigation works fine.
- A previous page in the navigation stack overlays the current page
- A previous page in the navigation stack overlays the current page but is invisible. Because of this, the user can’t tap anywhere the overlay page has elements.
Upon further investigation, I’ve found that this happens because the app-home has a z-index of 99 whereas the previous page has a z-index of 100
Here, app-home is the current page, but the pages above it in the navigation stack are causing problems
Expected Behavior Other pages which are not in the route should not overlay the current page
Issue Analytics
- State:
- Created 5 years ago
- Comments:18 (8 by maintainers)
Top Results From Across the Web
[Ionic 4] Old page overlays over current page after navigation
A previous page in the navigation stack overlays the current page but is invisible. Because of this, the user can't tap anywhere the...
Read more >Ionic 4 Old page overlays over current page after navigation
The navigation works fine. A previous page in the navigation stack overlays the current page; A previous page in the navigation stack overlays...
Read more >Pages overlaps on navigation in Ionic4 - Stack Overflow
I am facing an issue during navigation the pages overlaps like below give picture. I am using NavController for navigation. public ...
Read more >Pages Overlaps On Navigation In Ionic4 - ADocLib
When I put an ion-fab with slot"fixed" , the FAB icons overlap the iOS status bar. Create a blank page with ion-content; Put...
Read more >Announcing Ionic 6 - Ionic Blog
Ionic 6 has fewer breaking changes than both the previous Ionic 4 and ... Ionic 6 Migration Guide to get step-by-step upgrade instructions....
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Test on Emulator device part 2:
Android 4.4, API level 19, chrome version 30 error:

Android 5, chorme version 39 error:

Android 6, chrome version 44:

Android 7, chrome 55: working without
ion-page-invisible
Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.