编辑:我向Apple报告了这个错误,现在已关闭,在测试版iOS 9.0(13A4254v)上测试并正常工作.
编辑以获得更好的解释:
我在网页上有很多文章,都包含在div(列)中.这些文章有一个绝对位置,固定宽度和高度的类.
有一个按钮可以应用: - 一个translate3d到包装器/列 - 一个window.history.pushState
所有样式都正确应用于所有文章,但是当我按下按钮并在pushState之后,所有/部分nth-child()样式都没有正确应用(左,上和宽).如果我将:nth-child()更改为:nth-of-type(),则在pushState之后正常工作.
当safari确定激活切换到阅读器模式的可能性时,按下单击按钮并影响到translate3d元素(硬件加速)后,问题似乎是可见的.
它发生在使用iPad2,iPad3视网膜和4的Safari iOS8上.它不会发生使用iPad迷你视网膜.使用iOS7之前所有工作正常,但没有使用iOS8.
码:
<html>
<head>
<meta name="viewport" content="initial-scale = 1.0, maximum-scale = 1.0, minimum-scale = 1.0, user-scalable = 1.0">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<style>
body {
position: relative;
width: 100%;
height: 100%;
padding: 0;
margin: 0;
overflow: hidden;
}
#column {
-webkit-transition: 0.35s; transition: 0.35s;
-webkit-transform: translate3d(0px, 0px, 0px);
position: absolute;
top: 10px;
left: 10px;
border: 1px solid Grey;
width: 300px;
height: 225px;
}
.moveColumn {
-webkit-transform: translate3d(200px, 0px, 0px) …