问题
My cordova application is built for WP 8.0 Target. When running it on a WP8.1 device that doesn't have hardware buttons but a toggleable navbar instead, the HTML content is overlapped by the navbar. When hiding the navbar, the black background of the navbar stays and still overlaps the HTML. It is also possible to scroll the entire webview so i can see the overlapped content as well as the content of the webview.
Is it possible to prevent this overlapping or prevent the scrolling of the entire webview?
回答1:
I've had exactly the same problem. This can happen on windows phone 8.1 on devices with softkeys as the cordova web view is stretched to the full height of the screen, consequently it appears behind the softkeys/navbar.
It's not possible to detect with JavaScript the presence or height of the navbar and, as cordova seems to be written for windows phone 8 not 8.1 (at least 4.3 is which is what I'm using) it doesn't even access to the newer 8.1 API that would allow it to react to the navbar.
To that end I've written a Cordova plugin for my app to deal with this. It automatically resizes the web view when the app launches to take the navbar/soft keys into account. It will also resize the web view around the navbar/soft keys if the user toggles it by swiping up from the bottom or if the user rotates the phone to landscape (where the navbar/soft keys appear on the right/left, rather than the bottom)
You can also add an event listener which is fired when the soft keys/navbar changes, it will send you the height.
I've only tested it my app but I hope it works for you.
https://github.com/taroquu/CordovaNavbarPlugin
来源：https://stackoverflow.com/questions/29342517/cordova-phonegap-wp8-1-navbar-overlapping