[
https://issues.apache.org/jira/browse/CB-12811?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=16012902#comment-16012902
]
Kerri Shotts edited comment on CB-12811 at 5/16/17 6:43 PM:
------------------------------------------------------------
Ok, some thoughts.
# I can duplicate using your provided steps
# It appears this has been issue for quite some time (more recent eg
https://discussions.apple.com/thread/7088324?start=0&tstart=0, but I've seen
ones from several years back)
# This feels like a UIWebView bug, and we don't have any control over that.
Try:
# Use WKWebView if you can and see if it has the same problem -- but be aware,
that it's not a drop-in solution.
# Avoid position: fixed. You can accomplish a similar appearance by using an
element that fills the viewport that contains the header, footer, and content.
The header and footer can either be positioned absolutely or you can use
something like flexbox to lay everything out. The content element can be set so
that it allows scrolling (don't forget to enable inertial scrolling, though).
See if that improves anything.
# Try the ionic keyboard plugin and see if that changes anything.
was (Author: kerrishotts):
Ok, some thoughts.
1. I can duplicate using your provided steps
2. It appears this has been issue for quite some time (more recent eg
https://discussions.apple.com/thread/7088324?start=0&tstart=0, but I've seen
ones from several years back)
3. This feels like a UIWebView bug, and we don't have any control over that.
Try:
1. Use WKWebView if you can and see if it has the same problem -- but be aware,
that it's not a drop-in solution.
2. Avoid position: fixed. You can accomplish a similar appearance by using an
element that fills the viewport that contains the header, footer, and content.
The header and footer can either be positioned absolutely or you can use
something like flexbox to lay everything out. The content element can be set so
that it allows scrolling (don't forget to enable inertial scrolling, though).
See if that improves anything.
3. Try the ionic keyboard plugin and see if that changes anything.
> Plugin Inappbrowser on iOS - When keyboard appears, fixed divs are fixed to
> HTML page but not viewport
> ------------------------------------------------------------------------------------------------------
>
> Key: CB-12811
> URL: https://issues.apache.org/jira/browse/CB-12811
> Project: Apache Cordova
> Issue Type: Bug
> Components: cordova-plugin-inappbrowser
> Affects Versions: [email protected]
> Reporter: Ashraf Yussouff
> Attachments: index.html, pageForIAB.html, Screen Shot 2017-05-12 at
> 7.55.54 PM.png, Screen Shot 2017-05-12 at 7.56.21 PM.png, Screen Shot
> 2017-05-12 at 7.56.36 PM.png
>
>
> I am displaying an HTML form in the InAppBrowser. The page has a header fixed
> to the top and a footer fixed to the bottom using CSS (e.g. {position: fixed;
> top: 0px;}).
> When simply scrolling the page, the header and footer remain in place while
> the rest of the page moves.
> However, when an input receives focus and the iOS keyboard appears, the
> header and footer positions are only fixed with respect to the HTML page at
> the time the input received focus, but they are no longer fixed with respect
> to the viewport. As a result, if the page is scrolled up and down while the
> keyboard is open, the header and footer start moving along with the page.
> This behavior is not observed in the Safari mobile browser on the same
> device. On Safari, the header and footer remain in place while the rest of
> the page is scrollable when an input is clicked and the iOS keyboard appears
> below the browser.
> I will try to attach images if JIRA allows it after the issue has been
> created.
> NOTE: iOS is the only platform that I am working with, so I don't know if
> this issue occurs in other platforms as well. I am using plugin version 1.7.0
> and the Cordova versions I have seen this with are 6.4.0 and above.
--
This message was sent by Atlassian JIRA
(v6.3.15#6346)
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
