我能够在我的 iPhone 3GS iOS 6.1 上重现该问题,它会立即崩溃,而无需对页面进行任何操作。 Web Inspector 上没有错误。使用 iOS 模拟器时,它不会崩溃,但会在设备日志中显示 MobileSafari[11079]: CGAffineTransformInvert: singular matrix.。
如果我在不与任何元素交互的情况下滚动页面,即使我按像素滚动 1,错误 singular matrix 也会在控制台上重复。
分析多次,在 iOS 模拟器上我没有看到任何 javascript 内存泄漏。所以我猜这与渲染有关。
所以我删除了样式表http://festivals.ie/static/mNga2i69LFf9ezK2IBanFA9rPb7jjsGzC6PNOP5MjO1.css 进行检查,矩阵错误停止了。所以这证实了我的担忧。
接下来我们需要能够分开,是什么导致了这种情况。
我分析了页面并滚动了页面,等待singular matrix 错误,然后停止分析。这是我得到的:
一个 320 x 75 像素的重绘区域,我猜它是顶部标题。
所以我使用网络检查器删除了<div class="navbar navbar-fixed-top top-nav">,不再出现singular matrix 错误。
我尝试启用和禁用与 div 匹配的每种样式,唯一有任何区别的是position: fixed,但它可能是固定 div 内部的冲突。
我尝试了里面的每个元素,我发现只删除 <button> 可以解决问题。
现在我认为您可以跟踪该按钮的问题。
这是与按钮相关的css:
media="screen, projection"
mNga2i69LFf9ezK2IBanFA9rPb7jjsGzC6PNOP5MjO1.css:175
label, input, button, select, textarea {
font-size: 14px;
font-weight: normal;
line-height: 20px;
}
festivals.ie
media="screen, projection"
mNga2i69LFf9ezK2IBanFA9rPb7jjsGzC6PNOP5MjO1.css:21
button, input[type="button"], input[type="reset"], input[type="submit"] {
cursor: pointer;
-webkit-appearance: button;
}
festivals.ie
media="screen, projection"
mNga2i69LFf9ezK2IBanFA9rPb7jjsGzC6PNOP5MjO1.css:19
button, input {
line-height: normal;
}
festivals.ie
media="screen, projection"
mNga2i69LFf9ezK2IBanFA9rPb7jjsGzC6PNOP5MjO1.css:18
button, input, select, textarea {
margin: 0;
font-size: 100%;
vertical-align: middle;
}
festivals.ie
media="screen, projection"
mNga2i69LFf9ezK2IBanFA9rPb7jjsGzC6PNOP5MjO1.css:859
* {
margin: 0;
}
festivals.ie
media="screen, projection"
mNga2i69LFf9ezK2IBanFA9rPb7jjsGzC6PNOP5MjO1.css:798
::selection {
background: #4e87e1;
color: #ffffff;
}
Base Style Rules
input[type="button"], input[type="submit"], input[type="reset"], input[type="file"]::-webkit-file-upload-button, button {
-webkit-box-align: center;
text-align: center;
cursor: default;
color: buttontext;
padding: 0px 1em;
border: 1px solid rgb(76, 76, 76);
border-image: initial;
background-color: rgba(255, 255, 255, 0.0078125);
font: 11px Helvetica;
box-sizing: border-box;
}
input, textarea, keygen, select, button, isindex {
margin: 0em;
color: initial;
letter-spacing: normal;
word-spacing: normal;
line-height: normal;
text-transform: none;
text-indent: 0px;
text-shadow: none;
display: inline-block;
text-align: -webkit-auto;
}
button {
-webkit-appearance: button;
}
我希望这很有用,因为我花了很长时间才到这里。