2012-05-15 20 views
5

Modal pencereleri, kaydırılabilir gibi, kaydırılabilir olma becerisiyle geliştiriyorum. Ateşlendiklerinde, overflow: hidden ve modal kutu kapsayıcısında overflow: auto tanımlayın. Bu, masaüstü tarayıcılarda çok iyi çalışıyor ancak iPad'deki ilk testim (ve muhtemelen muhtemelen iOS'ta olduğunu varsayalım) bir sorun olduğunu ortaya çıkardı:iPad, belge kaydırmayı devre dışı bırakır ancak div taşması kaydırması yok

Modal bittiğinde, belge kaydırma modundan daha uzunsa kaydırma devam ediyor.

Ben sadece modal ya da kap tetiklediği takdirde kaydırma kabul edin niyetiyle bu çalıştı:

// Disable browser scrolling on iOS 
$(document).on('touchmove',function(e) { 
    if (($(e.target).attr('id') != id) && 
    ($(e.target).attr('id') != ('modal-'+id))) { 
     e.preventDefault(); 
    } 
}); 

Ve gerçekten sıkı yapıyor çalışır. Modal kaydırmalar ve sayfayı kaydırmayı bitirdiğinizde, yalnızca modalın içinde gezinirseniz mümkündür.

Herhangi bir fikrin var mı?

sen (siz modal butonuna tıklamak zorunda) istiyorsanız ipads bunu deneyin: http://www.onebigrobot.com/beta/altair/transforms-so

şimdiden teşekkür ederiz!

cevap

7

Küçük değişiklikler çok güçlü!

Tüm sorun, position: absolute'un position: fixed modelini değiştirerek modal kabında (ve gerekirse arka planın karanlık maskesinde) çözülür. Aslında mutlak konumlandırma ile modal sadece butonun sayfanın en üstünde olduğu için işe yaradı.

Sabit konumlandırma ile masaüstü tarayıcıları mükemmel çalışır ve ipad üzerinde ilginç bir şey olur. Modal kaydırma bittiğinde, sayfanın kaydırması çalışmaya başlar, ancak modal daima üstte iyi konumlandırılır.

Umarım bu soru birileri için yararlı olabilir.

+0

müthiş bir trilyon teşekkürler – Nasir

İlgili konular