Last active
December 23, 2015 07:39
-
-
Save shazron/6602131 to your computer and use it in GitHub Desktop.
PhoneGap / Apache Cordova - top margin for iOS 7
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Pre-requisites: | |
| // 1. Device core plugin | |
| // 2. Splashscreen core plugin (3.1.0) | |
| // 3. config.xml: <preference name="AutoHideSplashScreen" value="false" /> | |
| // 4. config.xml: <preference name="DisallowOverscroll" value="true" /> | |
| function onDeviceReady() { | |
| if (parseFloat(window.device.version) >= 7.0) { | |
| document.body.style.marginTop = "20px"; | |
| // OR do whatever layout you need here, to expand a navigation bar etc | |
| } | |
| navigator.splashscreen.hide(); | |
| } | |
| document.addEventListener('deviceready', onDeviceReady, false); |
@dmcg Yes, using JQuery Mobile too, and the webkit-transform whites out the whole page, but your solution works great for me.
body . padding -20px
by identy
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Good discussion here
http://blogs.telerik.com/appbuilder/posts/13-11-07/everything-hybrid-web-apps-need-to-know-about-the-status-bar-in-ios7
but I couldn't get the referenced plugin to work
The webkit-transform knackers JQuery Mobile for me, as its footers are now off the bottom of the page. The best overall I've found for JQM is