Meta viewport ve Android ile ilgili sorun

Question

Ekranda ortalanmış div-popup'lar oluşturmak için JQuery tabanlı bir genel javascript iletişim sınıfı oluşturmaya çalışıyorum. Tüm yaygın tarayıcılarda bunu başarmak sade vanilya idi.

Mobil platformlar için, görünümün konusu ortaya çıkar; Görünen görüntü alanı (ki sizin gördüğünüz gibi sitenin o andaki "izleme pencerenizdir, yakınlaştırılmış olsun veya olmasın) ve mizanpaj görünümünün farkı (alttaki sayfanın boyutları veya başka bir deyişle, CSS görüntü alanı).

Iphone için, ben, ölçeklendirme ortalama ayarlamak için DOM özelliği window.innerWidth ve window.innerHeight kullanmak mümkün olmuştur ve pageXOffset/pageYOffset ile, kaydırma ayarlamak için: o zaman

// Get dialog width/height 
var dx = $("#dialog").width(); 
var dy = $("#dialog").height(); 

// Get window (layout viewport) width/height 
var winW = $(window).width(); 
var winH = $(window).height(); 

if (window.innerWidth!=winW) { 
    // Zoomed in or users browser window width is smaller than layout width 
    var x = window.pageXOffset+(window.innerWidth-dx)/2; 
} else { 
    // Not zoomed in 
    var x = window.pageXOffset+(winW-dx)/2; 
} 

if (window.innerHeight!=winH) { 
    // Zoomed in or users browser window height is smaller than layout height 
    var y = window.pageYOffset+(window.innerHeight-dy)/2; 
} else { 
    // Not zoomed in 
    var y = window.pageYOffset+(winH-dy)/2; 
} 

Ben sola/yukarıdan x ve y'ye ayarlayarak benim konuşmamı konumlandırın. Bu, çoğu tarayıcıda ve hatta Iphone'da iyi çalışır, ancak Android platformlarında çalışmaz.

Google'ı kullanarak bazı aşırı araştırmalar yaptıktan sonra, Android'in window.innerWidth ve window.innerHeight özellikleriyle ilgili bazı sorunları olduğu görülmektedir (bkz. F örn. http://www.quirksmode.org/mobile/viewports2.html, "Görünen görünüm alanını ölçme" ifadesini arayın).

Android tarayıcılarını tanımlamak için her zaman kullaniciyi kullanmaniz ve pencereyi her zaman görsellestirilmis pencerede üst/sola yerletirecek olan window.pageXOffset/window.pageYOffset konumuna getirmistir. Ancak, bu pek çok nedenden ötürü kötü bir seçenektir, en azından yakınlaştırıldığında kötü görünüyor.

Android'de görünen görünüm alanını hesaplamak için bir yöntem bilen var mı? Ya da bunun için bir çözüm bulmuş olan var mı?

Answer 1

Yanıt, görünüm genişliğini cihaz genişliğine ayarlamanız gerektiği gibi görünüyor. Test ettiğim tüm Android sürümlerinde çalışıyor gibi görünüyor (2.1, 2.2 ve 2.3).

<meta name="viewport" content="width=device-width"> 

Answer 2

zaman ... İlgili viewport size yardımcı olabilir burada/genişlik konu, benim araştırma adil biraz gönderdiniz Web app on android browser WIDTH issue

Answer 3

Bu eski bir sorudur, ama bulamadık Bu iyi bir cevap ... Yani Android cihazlar bir grup üzerinde bir sürü çalışma sonra Android sorunu için harika bir çözüm (kesmek) bulduğumu düşünüyorum. Bu deneyin:

<!--HTML VERSION --> 
<div id="sojernTest" style="position:absolute; top:0;bottom:0;left:0;right:0;display:none;"></div> 

VEYA

// JAVASCRIPT WITH CSS CLASS 
var div = document.createElement('div'); 
div.id = "screenSizeHolder"; 
div.className = "screen_size_holder"; 
document.body.insertBefore(div, document.body.firstChild); 

$('#screenSizeHolder').html(" "); 

Sonra çapraz platformlarda çalışması gerekir ben slighly farklı bir yaklaşım ile geldi

screenHeight = parseInt($('#screenSizeHolder').css('height').replace('px','')); 
screenWidth = parseInt($('#screenSizeHolder').css('width').replace('px','')); 

Answer 4

o elementin boyutunu kapmak

http://www.jqui.net/tips-tricks/fixing-the-auto-scale-on-mobile-devices/

da

How to set viewport meta for iPhone that handles rotation properly?