Yakınlaştırma sırasında gizli kilitlenme tarayıcısı iPad 4 tarayıcımda (html ya da Chrome olsun) aşağıdaki html sayfasını görüntülediğimde, tarayıcı yakınlaştırma sırasında çöküyor (ya da çift dokunuşla zumlamak veya yakınlaştırmak için çimdiklemek). Sayfa -webkit-backface-görünürlük özelliği gizli 40 basit divs (kısaca javascript tarafından yerleştirilir) içerir.iOS: Yakınlaştırmak -webkit-backface-görünürlük:
<!doctype html>
<html>
<head>
<style>
.front {
-webkit-backface-visibility: hidden;
position: absolute;
border: 1px solid black;
width: 800px;
height: 800px;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</head>
<body id="outer">
<script>
$(function() {
for (var i = 0; i < 40; i++) {
$(document.createElement('div'))
.css({top: i*10, left: i*10})
.addClass("front").appendTo($("#outer"));
}
})
</script>
</body>
</html>
Aynı sorun muhtemelen iPhone ve eski iPad'lerde de ortaya çıkar. Bu garip ve can sıkıcı bir böcek; -webkit-backface-görünürlük: iç elemanların gizli tarzı devre dışı bırakıldığında olmaz.
Şunları soruyorsunuz: neden sadece -webkit-arka yüz görünürlüğünü kaldırmıyorum: gizli stil bu sayfada herhangi bir fark yaratmadığından? Eh, bu minimal bir counterexample, gerçek, daha karmaşık bir sayfada ihtiyacım var.