如何在iOS 7上定位：固定工作？

Question

I've created a test webpage demonstrating position:fixed issue on UIWebView and Mobile Safari: 我创建了一个测试网页，展示了position:fixed UIWebView和Mobile Safari上的问题：

<!DOCTYPE html>
<html style="overflow: hidden; ">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.2, user-scalable=no">
  <title>Test</title>

  <style type="text/css">
    * {
      -webkit-tap-highlight-color: rgba(0,0,0,0);
    }
    body {
      margin: 0px;
      padding: 0px;
    } 
    .fullscreen {
      background: transparent;
      display: block;
      position: absolute;
      top: 0; left: 0;
      width: 100%;
      height: 100%;
    }
    .screen {
      position: fixed;
      left: 0px;
      top: 0px;
      width: 100%;
      height: 100%;
      /*-webkit-box-shadow: inset 0 0 10px #0d1f2b;
      -moz-box-shadow: inset 0 0 10px #0d1f2b;
      -o-box-shadow: inset 0 0 10px #0d1f2b;*/
      box-shadow: inset 0 0 10px #0d1f2b;
    }
  </style>
</head>
<body>
  <div class="screen" id="screen"></div>
  <form><textarea id="code" name="code" class="fullscreen" rows="1">
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
  </textarea></form>
</body>
</html>

Steps to reproduce: 重现步骤：

Open the demo webpage on Mobile Safari on iPad or iPhone. 在iPad或iPhone的Mobile Safari上打开演示网页。
Tap on the textarea to show a keyboard. 点击文本区域以显示键盘。
Scroll up or down to see the issue. 向上或向下滚动以查看问题。

The inset shadow should be along the edges of the browser window, but it's incorrectly positioned further down the page. 插图阴影应沿浏览器窗口的边缘，但它在页面下方的位置不正确。

在此处输入图片说明

How can I make position:fixed work properly? 我该如何使position:fixed工作正常？

Answer 1

There is not answer to the original question but it's a solution with the same result. 原始问题没有答案，但结果是相同的。 Change body's style to the following: 将身体样式更改为以下样式：

.body {
  margin: 0px;
  padding: 0px;

  /*-webkit-box-shadow: inset 0 0 10px #0d1f2b;
  -moz-box-shadow: inset 0 0 10px #0d1f2b;
  -o-box-shadow: inset 0 0 10px #0d1f2b;*/
  box-shadow: inset 0 0 10px #0d1f2b;

  min-height: 100%;
}

screen element may be removed. screen元素可能会被删除。

如何在iOS 7上定位：固定工作？

问题描述

1 个解决方案

解决方案1
1 已采纳 2013-10-04 12:21:22

如何在iOS 7上定位：固定工作？

问题描述

1 个解决方案

解决方案1 1 已采纳 2013-10-04 12:21:22

解决方案1
1 已采纳 2013-10-04 12:21:22