Bu konuyla ilgili neredeyse tüm stackoverflow sorularını okudum, ancak beklediğim gibi çalışmaz.Yalnızca iPad'i (veya en iyi 1024x768 mobil aygıtlarda) algılamak için güvenilir bir medya sorgusu
Bir medya sorgusu ile sadece iPad cihazını (ya da en iyi ~ 1024x768 mobil cihaz) tespit etmek için bana istendi. çözünürlüğü 1024x768 (ancak firefox) olarak ayarlanmıştır dizüstü ve masaüstü Win32/MacOS üzerinde ben
@media screen
and (min-device-width: 768px)
and (max-device-width: 1024px) {
...
}
kullanmaya çalıştı ama bu medya sorgusu da Chrome maçları (ve Safari, sanırım). orientation:portrait ve orientation:landscape'u tanımlayan bu medya sorgusunu denedim, ancak şanssız. Ayrıca masaüstü webkit tarayıcısında da tanınır.
Sorunu test etmek için this fiddle deneyebilirsiniz.
arama yaptıktan sonra ben Firefox ve Opera ise hangi,ben Safari (ve diğer WebKit tarayıcıları içinde test ettik) spec takip etmiyor düşünüyorum
belirtilmektedir this interesting article geldi."Genişlik" ortam özelliği, çıkış aygıtının hedeflenen görüntü alanının genişliğini açıklar. Sürekli ortam için bu, görünüm çubuğunun (eğer varsa, CSS2, bölüm 9.1.1 [CSS21] tarafından açıklandığı gibi) genişliğidir.
yüzden max-device-width (1024-15)
@media screen and (min-device-width: 768px)
and (max-device-width: 1009px) {
...
}
olarak 1009px ile (fiddle) güvenilir ve bu ortam sorgu, yönlendirme tanımlayan kullanımı durumunda (
ancak çalışmıyor () bana şaşırtıcı fiddle)
@media screen and (device-width:768px) and (orientation:portrait),
screen and (device-width:1009px) and (orientation:landscape) {
...
}
o düzgün çalışıyor gibi görünüyor ve sadece safari/iPad ile eşleşiyor gibi görünüyor.
Q: Bu medya sorgusu ihtiyacım için yeterince güvenilir midir? Her zaman iPad/iPad2'de çalışır mı? Ya da diğer bazı cihazlarla bazı kenar durumları ve beklenmedik maçlar beklemem gerekiyor? Böyle bir durumda daha verimli ve güvenilir bir medya sorgusu önerebilir misiniz?
Tam olarak nedir? Örneğin. Farklı bir ekran çözünürlüğü ile önümüzdeki ay bir iPad 3 olacak. Ve evet - Diğer tabletlerin de eşleşmesini beklerdim. – Lennart
Kesin amaç öncelikle ipad/ipad2. Bunun RWD açısından bir anlamı olmadığını biliyorum (bir mobil ve 1024x768 masaüstü arasındaki fark nedir? Onlar IMHO ile aynı şey olarak düşünülmelidir) ama benden saf css'de böyle bir şey yapmamı istedim. Bunu başar - eğer tabii ki mümkün. – fcalderan
iPad için bir site dostu yapmaya mı çalışıyorsunuz? Bu durumda, siteyi tüm cihazlar için 'dokunma' dostu hale getirmekten daha iyi olur ve bu durumda cihaz dokunma olaylarını destekliyorsa koklamak için modernizr gibi kütüphaneleri kullanabilirsiniz (böylece hangi css dosyasının açılacağını değiştirebilirsiniz. javascript) – Skuld