Yani bu intersting sorunu Ben henüz olarak düzeltmek mümkün olmamıştı mobil safari bu web uygulaması ile yaşıyorum.ilginç mobil safari gizli içerik sorunu
Tıklamada görünen bir "display: none" menü divum var. Menü görüntülendiğinde, div içindeki içerik gerektiği gibi görüntülenir. Sorun, ekran dışı içeriğin içinde. Div içeriği kaydırıldığında, artık görüntü alanı içinde olan ekran dışı içerik, kaydırma tamamen durdurulana kadar hiç görünmeyecektir. Bu bir yükleme sorunu değil, çünkü tüm içerikler zaten yüklendi ve bu, yukarı kaydırdığınızda bile gerçekleşmeye devam ediyor.
Bu, aslında sayfada bulunan içerikle, yalnızca gizli menü divs'ında yüklenen içerikle gerçekleşmez. Özel kodlama veya herhangi bir şey kullanmıyorum, sadece standart css ve jquery .click işlevi. Bunu düzeltmek için düşünebildiğim her yöntemi denedim. div içinde kaydırma yerine gerçek sayfa kaydırma içerik görüntüleme sorununu sabit kullanarak, ama nedense o ivme ile kaydırma olmaz ve gizli div kendisi belki 2 saniye gibi daha uzun görünmesini olması gerekenden daha alacağını hangi elbette asla iyi ol.
Bunu nasıl düzeltebilirim?
Düzenleme - Kod aşağıda:
CSS
#menu {
width:720px;
height:100%;
overflow:auto;
-webkit-overflow-scrolling:touch;
background-color:#000000;
display:none;
position:absolute;
z-index:9997;
}
#main-menu {
width:100%;
display:none;
background-color:#000000;
}
<div id="menu">
<div id="main-menu">
<a href="#templates/my-account.php" class="close">
<div id="menu-item">
<img src="images/menu-account.png" />
<div id="menu-shadow"></div>
<div id="menu-item-title"><div class="menu-item-title">Account Settings</div></div>
</div>
</a>
<a href="#templates/my-account.php" class="close">
<div id="menu-item">
<img src="images/menu-account.png" />
<div id="menu-shadow"></div>
<div id="menu-item-title"><div class="menu-item-title">Account Settings</div></div>
</div>
</a>
<a href="#templates/my-account.php" class="close">
<div id="menu-item">
<img src="images/menu-account.png" />
<div id="menu-shadow"></div>
<div id="menu-item-title"><div class="menu-item-title">Account Settings</div></div>
</div>
</a>
<a href="#templates/my-account.php" class="close">
<div id="menu-item">
<img src="images/menu-account.png" />
<div id="menu-shadow"></div>
<div id="menu-item-title"><div class="menu-item-title">Account Settings</div></div>
</div>
</a>
</div>
</div>
<div id="wrapper">
<div class="content-loading"></div>
<div class="contentarea">
<div class="content pageURL"></div>
</div>
</div>
<div id="btn-menu" class="bar-button"><img src="images/bar-btn-menu.png" /></div>
JQuery
<script type="text/javascript">
$('#btn-menu').click(function(){
$("#menu").show();
$("#main-menu").show();
$("#bottom-bar-close").show();
});
</script>
kodunu ve sorunun bir örnek bir bağlantı verin. Kodu ve sonucu ya görselleştirmek ve görselleştirmek için bir acıdır. –
Çerçeveli sayfalar iOS'ta, diğer öğeler gibi kaydırma gibi elastik tipte kaydırma yapmaz. Size yardımcı olması için bazı kod parçasını sağlamanız gerekiyor. –
Kodu yakında yayınlayacağız. Sayfa çerçeveli değil, sadece gizli bir div ve uygulama için ajax kullanıyorum, bu yüzden hepsi bir sayfada. – CoreyRS