iOS6, UIWebView and position:fixed

2
votes

We have a PhoneGap application that has navigation bar and tab bar "implemented" as divs with fixed position (see screen 1).

In iOS6 there's some strange behavior with these divs when the keyboard is shown. When we type a first letter the div will disappear and the blank area is displayed instead. When we're closing a keyboard everything goes back to normal.

This happens in UIWebView only and doesn't happen in Mobile Safari.

Did anyone had something similar? I suppose we shouldn't be alone.

Screen shots:

Normal ViewKeyboard open, but no text is typed inTyped text

2
cordovaios6
I have discovered some odd behaviour in Safari that is probably related. When a page is set to fixed position and you have an input field and a checkbox, dismissing the keyboard by checking the checkbox causes the page to be pulled down with the keyboard. To overcome this I have moved to absolute positioning rather than fixed. Seems to be erroneous in iOS6/Safari 6 but fine in iOS5. – Purpletoucan

2 Answers

1
votes

The problem is jQuery mobile setting the page height from script at the same time as the OS pushes the view up to keep the input visible.

Some css to ignore the jqm height change fixed the issue for me.

.ui-mobile, .ui-mobile .ui-page {
    min-height: 100% !important;
}
0
votes

Finally, we had to tweak that and hide the footer on entering the edit field and storing it on blurring event. Not too good, but helps.