webkit-overflow-scrolling forms broken on iOS 7 fu

2020-02-22 04:28发布

I'm having trouble with a full-screen (saved to home screen) iPhone web app on iOS7.

Typically, when an input is selected, it has scrolled into view above the keyboard.

However, this doesn't seem to happen on iOS7 for scrolling DIVs in a full-screen web app.

Thus, when a DIV uses "-webkit-overflow-scrolling: touch" and an input in the bottom half of the screen is clicked, the keyboard is fired, but the input doesn't scroll up.

AND, at that time, the input won't respond to any further onFocus events that I could otherwise scroll it up with.

Anyone seen a workaround?

2条回答
姐就是有狂的资本
2楼-- · 2020-02-22 04:50

It worked on my WebApp by removing the height settings.

查看更多
啃猪蹄的小仙女
3楼-- · 2020-02-22 05:13

Updating the viewport meta tag fixed it for me.

I changed this:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />

To this:

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, target-densityDpi=device-dpi" />

height=device-height is the actual fix (without it the viewport gets resized to accommodate the keyboard).

查看更多
登录 后发表回答