ios - 修复了在 iOS 11 的 webview 中向下滚动时标题消失的问题

Question

我有一个原生 iOS 应用程序，它带有一个 webview 来显示网络内容。我的应用程序中有一个具有以下属性的固定 header :

#header {
    height: 60px;
    background-color: @mainColor;
    color: #ffffff;
    padding: 10px;
    text-align: center;
    position: fixed;
    width: 100%;
    z-index: 1;
}

在我升级到 iOS 11 之前一切正常。现在，当我向下/向上滚动时，标题在滚动过程中消失，当滚动完成时，标题再次出现。

这也可以在 Xcode 8 中重现。

Answer 1

我只是在写一些代码，一个一个地尝试

• 试试下面的

  self.automaticallyAdjustsScrollViewInsets = false
  

• 试试下面的

  [self.webView.scrollView setContentInsetAdjustmentBehavior:UIScrollViewContentInsetAdjustmentNever];
  

• 尝试使用以下(更改您的代码)

  header {
      height: 60px;
      background-color: @mainColor;
      color: #ffffff;
      padding: 10px;
      text-align: center;
      position: fixed;
      width: 100%;
      z-index: 1;
      transform: translateZ(0);
      -moz-transform: translatez(0);
      -ms-transform: translatez(0);
      -o-transform: translatez(0);
      -webkit-transform: translateZ(0);
      -webkit-font-smoothing: antialiased;
  }
  

  一些有用的链接可能对您有用!

• http://ayogo.com/blog/ios11-viewport/

• https://forums.developer.apple.com/thread/90472
• How to fix the iOS 11 input element in fixed modals bug
• https://github.com/PierBover/ios-iframe-fix
• https://stanko.github.io/ios-safari-scoll-position-fixed/

From Apple official note:

Important:

Starting in iOS 8.0 and OS X 10.10, use WKWebView to add web content to your app. Do not use UIWebView or WebView.

所以你应该用 WKWebView 尝试一次。