HTML5'te iPad Mini'yi algılama

Apple'ın iPad Mini'si, iPad 2'nin istediğimizden daha küçük bir klonudur. JavaScript'te, window.navigatornesne Mini ve iPad 2 için aynı değerleri ortaya koyar. Farkı tespit etmek için şu ana kadar yaptığım testler başarıya yol açmadı.

Bu neden önemli?

İPad Mini ve iPad 2 ekranları piksel cinsinden aynı olduğundan, gerçek boyutta (inç / santimetre) değiştiklerinden, PPI (inç başına piksel ) olarak değişir .

Web uygulamalarının ve oyunlarının kullanıcı dostu bir arayüz sunması için, belirli öğelerin boyutu kullanıcının başparmağı veya parmak pozisyonuna göre ayarlanır, bu nedenle, daha iyi bir kullanıcı deneyimi sağlamak için belirli görüntüleri veya düğmeleri ölçeklendirmek isteyebiliriz.

Şimdiye kadar denediğim şeyler (bazı oldukça açık yaklaşımlar dahil):

• window.devicepixelratio
• Cm birim cinsinden CSS elemanı genişliği
• CSS medya sorguları ( resolutionve gibi -webkit-device-pixel-ratio)
• Benzer birimlerdeki SVG çizimleri
• Belirli bir süre için her türlü CSS webkit dönüşümünü yapmak ve oluşturulmuş kareleri saymak requestAnimFrame(ölçülebilir bir fark tespit etmeyi umuyordum)

Fikirlerden yeni çıkıyorum. Sen nasılsın?

Güncelleme Şimdiye kadar verdiğiniz yanıtlar için teşekkür ederiz. Apple'ın hepsine hükmedecek bir rehber olan uhm'a sahip olduğu için iPad mini'yi 2'ye karşı algılamaya oy veren insanlar hakkında yorum yapmak istiyorum. Tamam, işte neden bir kişinin bir iPad mini veya 2 kullanıp kullanmadığını bilmenin gerçekten mantıklı olduğunu düşündüğüm mantığım.

İPad mini sadece çok daha küçük bir cihaz değil (9.9 inç ve 7.9 inç), aynı zamanda form faktörü farklı bir kullanıma izin veriyor. Chuck Norris değilseniz, oyun oynarken iPad 2 genellikle iki elle tutulur . Mini daha küçüktür, ancak aynı zamanda çok daha hafiftir ve bir elinde tuttuğunuz ve kaydırmak veya dokunmak veya başka bir şey yapmak için başka bir oyun kullanmak için oyun oynamaya izin verir. Bir oyun tasarımcısı ve geliştiricisi olarak, sadece bir mini olup olmadığını bilmek istiyorum, böylece istersem oyuncuya farklı bir kontrol programı sunmayı seçebilirim (örneğin, bir grup oyuncuyla A / B testinden sonra).

Neden? Kullanıcıların çoğunun varsayılan ayarlarla gitme eğilimi olduğu kanıtlanmış bir gerçek, bu yüzden sanal bir başparmak çubuğu bırakarak ve oynatıcı yüklediğinde ekrana başka bir dokunmaya dayalı kontrol (sadece rastgele bir örnek vererek) koymak ilk kez oyun ben ve muhtemelen diğer oyun tasarımcıları, isterdim ne mümkün yapmak.

IMHO, bu kalın parmak / yönerge tartışmalarının ötesine geçiyor ve Apple ve diğer tüm satıcıların yapması gereken bir şey: cihazınızı benzersiz bir şekilde tanımlamamıza ve aşağıdaki yönergeler yerine farklı düşünmemize izin verin .

Bir stereo ses dosyası çalın ve sağ kanalda ve sol kanalda ses seviyesi yüksek olduğunda ivmeölçer yanıtını karşılaştırın - iPad2'de mono hoparlörler bulunurken, iPad Mini'de dahili stereo hoparlörler bulunur.

Veri toplamak için yardımınıza ihtiyacınız var, lütfen bu sayfayı ziyaret edin ve bu çılgın fikir için veri toplamamı sağlayın . İPad mini cihazım yok, bu yüzden gerçekten yardımına ihtiyacım var

Güncelleme: Görünüşe göre, bu değerler sekme oluşturma sırasında görünüm alanı genişliğini ve yüksekliğini bildiriyor ve döndürüldüklerinde değişmiyorlar, bu nedenle bu yöntem cihaz algılama için kullanılamaz !

İPad Mini ve iPad 2 için ikisinden birini screen.availWidthveya screen.availHeightfarklı göründüğü gibi kullanabilirsiniz.

iPad Mini

screen.availWidth = 768
screen.availHeight = 1004

Ipad 2

screen.availWidth = 748
screen.availHeight = 1024

Kaynak: http://konstruktors.com/blog/web-design/4396-detect-ipad-mini-javascript/

Bunun biraz düşük teknolojili bir çözüm olabileceğini anlıyorum, ancak henüz başka bir şey bulamıyoruz gibi görünüyor.

Zaten diğer cihazların çoğunu kontrol ettiğinizi varsayıyorum, bu nedenle aşağıdaki senaryoları görüyorum.

Özel CSS / boyutlandırma gerektiren TÜM en popüler cihazları kontrol edebilirsiniz ve bunlardan hiçbiriyle uyuşmuyorsa ya bir iPad mini olduğunu varsayabilir ya da sadece kullanıcıya sorabilir misiniz?

// Device checks here
...
else {
  // it would probably be better to make this a nicer popup-thing
  var mini = prompt("Are you using a iPad mini? Press yes for a better user experience");
  // Store the result for future visits somehow.
}

Bunun şu anda aptalca bir yaklaşım gibi görünebileceğini biliyorum, ancak şu anda cihazın bir iPad mini mi yoksa iPad 2 mi olduğuna karar vermenin bir yolu yoksa, en azından web sitesi böyle bir şey yapan iPad mini cihazlarla kullanılabilir.

Hatta böyle bir şeyle gidebilirsin:

"Size mümkün olan en iyi tarama deneyimini sunmak için web sitesini cihazınıza göre özelleştirmek üzere cihaz türünüzü tespit etmeye çalışıyoruz. Ne yazık ki sınırlamalar nedeniyle bu her zaman mümkün değildir ve şu anda bir iPad 2 veya iPad kullanıp kullanmadığınızı belirleyemiyoruz. Bu yöntemleri kullanarak mini.

Mümkün olan en iyi tarama deneyimi için lütfen aşağıdan kullandığınız cihazı seçin.

Bu seçenek, ileride bu cihazdaki web sitesini ziyaret etmek için saklanacaktır.

[] iPad 2 
[*] iPad mini
[] Ancient blackberry device

"

Javascript'te istemci tarafı yapabileceğiniz ve yapamayacağınız şeylere tamamen aşina değilim. Bir kullanıcının IP'sini alabileceğinizi biliyorum, ancak kullanıcının mac adresini almak mümkün mü? Bu aralıklar iPad2'ler ve iPad mini'ler arasında farklı mı?

Bunun korkunç bir çözüm olduğunu biliyorum, ancak şu anda bir iPad Mini ve iPad 2 arasında ayrım yapmanın tek yolu, yapı numarasını kontrol etmek ve her yapı numarasını ilgili cihazla eşlemektir.

Size bir örnek vereyim: iPad mini, sürüm 6.0, 10A406derleme numarası olarak " ", iPad 2 ise " 10A5376e" ile karşılaşıyor.

Bu değer, kullanıcı aracısı ( window.navigator.userAgent) üzerindeki bir regex yoluyla kolayca elde edilebilir ; bu sayıya " Mobile/" öneki eklenir .

Ne yazık ki bu bir iPad Mini'yi tespit etmenin tek kesin yolu; viewportİçeriği farklı ekran boyutlarında düzgün bir şekilde görüntülemek için ilgili bir yaklaşımı (vh / vw birimlerini kullanarak) desteklemenizi öneririm .

tl; dr Şişman ve sıska parmaklar arasında da telafi etmediğiniz sürece iPad mini ve iPad 2 arasındaki farkı telafi etmeyin.

Apple kasıtlı olarak farkı anlatmanıza izin vermiyor gibi görünüyor. Apple, iPad'lerin farklı boyuttaki sürümleri için farklı kod yazmamızı istemiyor gibi görünüyor. Apple'ın bir parçası olmamak, bunu bilmiyorum, sadece böyle göründüğünü söylüyorum. Belki de, geliştirici topluluğu iPad minis için süslü bir dedektör bulursa, Apple bu dedektörü iOS'un gelecekteki sürümlerinde kasten kırabilir. Apple, minimum hedef boyutunuzu 44 iOS noktasına ayarlamanızı istiyor ve iOS, iki boyutta, daha büyük iPad boyutu ve daha küçük iPhone / iPad mini boyutu gösterecektir. 44 puan cömerttir ve kullanıcılarınız kesinlikle daha küçük iPad'de olup olmadıklarını bileceklerdir, bu yüzden kendi başlarına telafi edebilirler.

Dedektör istemek için belirtilen nedeninize geri dönmenizi öneririm: son kullanıcı konforu için hedef boyutunu ayarlama. Büyük iPad'de bir boyut ve küçük iPad'de başka bir boyut için tasarım yapmaya karar vererek, tüm insanların aynı boyutta parmaklara sahip olduğuna karar veriyorsunuz. Tasarımınız bir iPad 2 ve iPad mini'den boyut farkı fark yaratacak kadar sıkı ise, ben ve eşim arasındaki parmakların boyutundan daha büyük bir fark yaratacaktır. Bu yüzden iPad modelini değil, kullanıcının parmak boyutunu telafi edin.

Parmak boyutunun nasıl ölçüleceğine dair bir önerim var. Ben yerel bir iOS geliştiricisiyim, bu yüzden bunun HTML5'te gerçekleştirilip gerçekleştirilemeyeceğini bilmiyorum, ancak yerel bir uygulamada parmak boyutunu nasıl ölçeceğim. Kullanıcının iki nesneyi bir araya getirmesini ve sonra ne kadar yakınlaştıklarını ölçmesini isterdim. Daha küçük parmaklar nesneleri birbirine yaklaştırır ve bu ölçümü bir ölçeklendirme faktörü elde etmek için kullanabilirsiniz. Bu, iPad boyutunu otomatik olarak ayarlar. Aynı kişi, iPad mini'de ekran noktalarının iPad 2'ye göre daha büyük bir ölçümüne sahip olacaktır. Bir başlangıç ​​adımı olarak al. Örneğin bir atış oyununda oyuncu cephaneyi kıstırma hareketiyle tabancaya koysun.

Kullanıcıdan iPad'lerini yerden birkaç bin metre yukarıda bırakmasını isteyin. Ardından iPad'in terminal hızına ulaşması için geçen süreyi ölçmek için dahili ivmeölçeri kullanın. Daha büyük iPad'in daha yüksek bir sürükleme katsayısı vardır ve bir iPad Mini'den daha kısa sürede terminal hızına ulaşmalıdır .

İşte başlamanız için bazı örnek kod.

function isIPadMini( var timeToReachTerminalVelocity )
{
    return (timeToReachTerminalVelocity > IPAD_MINI_THRESHOLD);
}

Apple, bir sonraki iPad'i kaçınılmaz olarak farklı bir form faktöründe piyasaya sürdüğünde, neredeyse bu kodu tekrar gözden geçirmeniz gerekiyor. Ama eminim her şeyin üstünde kalacaksınız ve iPad'in her yeni sürümü için bu hack'i koruyacaksınız.

Ne yazık ki, şu anda bunun mümkün olmadığı anlaşılıyor: http://www.mobilexweb.com/blog/ipad-mini-detection-for-html5-user-agent

İki gün önce ilk tespit edilen sorunu tweetledim: “ iPad Mini Kullanıcı Aracısının iPad 2 ile aynı olduğu doğrulandı ”. Kelimenin tam anlamıyla yüzlerce cevap aldım kullanıcı aracı koklama kötü bir uygulama olduğunu, cihazlar değil, vb özellikleri tespit gerekir.

Evet çocuklar, haklısınız, ancak sorunla doğrudan bir ilişkisi yok. İkinci kötü haberi de eklemeliyim: “özellik tespiti” için hiçbir müşteri tarafı tekniği yoktur .

Bu vahşi bir çekim, ancak iPad 2 ve iPad mini arasındaki farklardan biri, eskisinin 3 eksenli jiroskopa sahip olmaması. Belki ondan ne tür bilgiler alabileceğinizi görmek için WebKit cihaz yönlendirme API'sını kullanmak mümkün olabilir.

Örneğin, bu sayfa sadece rotationRatecihazın bir jiroskopa sahip olması durumunda değeri alabileceğinizi düşündürmektedir .

Maalesef çalışan bir POC veremiyorum - iPad mini'ye erişimim yok. Belki bu yönlendirme API'leri hakkında biraz daha fazla bilgi sahibi olan biri buraya gelebilir.

İPad 2 ve iPad Mini'nin farklı boyutlarda pilleri var.

İOS 6 destekliyorsa, geçerli pil düzeyini 0.0..1.0kullanarakwindow.navigator.webkitBattery.level . Bir düzeyde donanım veya yazılımda, CurrentLevel / TotalLevelher ikisi de ints olduğu hesaplanır . Eğer öyleyse, bunun katı olan bir şamandıra ile sonuçlanacaktır 1 / TotalLevel. Her iki cihazdan da çok fazla pil seviyesi okuması battery.level * nyaparsanız ve hesaplarsanız, tüm sonuçların tamsayılara yakın olmaya başladığı bir n değeri bulabilir iPad2TotalLevelve bu size ve iPadMiniTotalLevel.

Bu iki sayı farklı ve karşılıklı olarak asal ise, o zaman üretimde battery.level * iPad2TotalLevelve hesaplayabilirsiniz battery.level * iPadMiniTotalLevel. Hangisi bir tam sayıya daha yakınsa hangi cihazın kullanıldığını gösterir.

Bu cevaptaki ifs sayısı için üzgünüm! Umarım daha iyi bir şey gelir.

DÜZENLEME 1: Aşağıdaki orijinal cevabım "yapma" idi. Olumlu olmak için:

Asıl sorunun bence iPad X ile iPad mini arasında bir ilgisi yok. Bence kullanıcı arayüzü boyutlarını ve yerleştirmeyi kullanıcının ergonomisine göre yapmakla ilgili. UI öğesi boyutlandırmanızı ve belki de konumlandırmayı yönlendirmek için kullanıcının parmaklarının boyutunu belirlemeniz gerekir. Bu, yine, hangi cihaz üzerinde çalıştığınızı bilmenize gerek kalmadan ulaşılmalıdır ve muhtemelen ulaşılmalıdır. Abartalım: Uygulamanız 40 inç çapraz ekranda çalışıyor. Marka ve model veya DPI bilmiyorum. Kontrolleri nasıl boyutlandırıyorsunuz?

Siteye / oyuna kapı elemanı olan bir düğme göstermeniz gerekir. Bunu nerede veya nasıl yapacağınıza karar vermek size kalmış.

Kullanıcı bunu tek bir düğme olarak görecek olsa da, gerçekte görsel olarak kaplanmış küçük bir düğme resmi matrisinden tek bir düğme görüntüsü olarak görünecektir. Her biri 5 x 5 piksel olan 400 düğmeden oluşan 100 x 100 piksel bir düğme düşünün. Burada neyin anlamlı olduğunu ve örneklemenizin ne kadar küçük olması gerektiğini görmek için denemeler yapmanız gerekir.

Düğme dizisi için olası CSS:

.sense_row {
  width:100px;
  height:5px;
  margin:0;
  padding:0;
}

.sense_button {
  float:left;
  width:3px;
  height:3px;
  padding:0px;
  margin:0px;
  background-color:#FF0;
  border:1px solid #000;
} 

Ve ortaya çıkan dizi:

Kullanıcı düğme dizisine dokunduğunda, etkili bir şekilde kullanıcının parmaklarının temas alanının görüntüsünü alırsınız. Ardından, gereksinimlerinize göre çeşitli UI öğelerini ölçeklemek ve konumlandırmak için kullanabileceğiniz bir dizi sayıya ulaşmak için istediğiniz ölçütleri (muhtemelen ampirik olarak türetilmiş) kullanabilirsiniz.

Bu yaklaşımın güzelliği, artık hangi cihaz adı veya modeliyle uğraştığınızı umursamamanızdır. Tek önemsediğiniz, kullanıcının parmağının cihaza göre boyutu.

Bu sense_array düğmesinin uygulamaya giriş sürecinin bir parçası olarak gizlenmiş olabileceğini hayal ediyorum. Örneğin, bir oyunsa, belki bir "Oynat" düğmesi veya kullanıcının adlarını içeren çeşitli düğmeler veya hangi seviyeyi oynayacaklarını seçmek için araçlar vb. Olabilir. Sense_array düğmesi kullanıcının oyuna girmek için dokunması gereken her yerde yaşayabilir.

DÜZENLEME 2: Sadece o kadar çok algılama düğmesine ihtiyacınız olmadığını belirtmek. Büyük bir yıldız işareti gibi düzenlenmiş bir dizi eşmerkezli daire veya düğme *iyi olabilir. Denemek zorundasın.

Eski cevabımla aşağıda, madalyonun her iki tarafını da veriyorum.

ESKİ CEVAP:

Doğru cevap: Bunu yapma. Bu kötü bir fikir.

Düğmeleriniz bir mini üzerinde kullanılamayacak kadar küçükse, düğmelerinizi büyütmeniz gerekir.

Yerel iOS uygulamaları yaparken hiç bir şey öğrendiysem, Apple'ı alt etmeye çalışmanın aşırı acı ve ağırlaştırmanın bir formülü olduğu. Cihazı tanımanıza izin vermemeyi seçtiler, çünkü sandbox'larında, yapmamalısınız.

Merak ediyorum, portre veya manzaradaki boyutu / konumu ayarlıyor musunuz?

Mikro bir karşılaştırmaya ne dersiniz, iPad 2'de kabaca X mikrosaniye ve iPad mini'de Y sn alan bir şey hesaplayın.

Muhtemelen yeterince doğru değildir, ancak iPad mini'nin çipinin daha verimli olduğu konusunda bazı talimatlar olabilir.

Evet, jiroskopu kontrol etmek için iyi bir nokta. İle kolayca yapabilirsiniz

https://developer.apple.com/documentation/webkitjs/devicemotionevent

ya da benzeri bir şey

window.ondevicemotion = function(event) {
    if (navigator.platform.indexOf("iPad") != -1 && window.devicePixelRatio == 1) {
        var version = "";
        if (event.acceleration) version = "iPad2";
        else version="iPad Mini";

        alert(version);
    }
    window.ondevicemotion = null;
}​

Test etmek için iPad'iniz yok.

İPad2 kullanıcı aracısına sahip tüm kullanıcıların yerleşik kamerayı kullanarak fotoğraf sağlamalarını ve HTML Dosya API'sını kullanarak çözünürlüğü algılamalarını isteyin . iPad Mini fotoğrafları, kameradaki geliştirmeler nedeniyle daha yüksek çözünürlükte olacaktır.

Ayrıca görünmez bir tuval öğesi oluşturarak oynayabilir ve Canvas API'sını kullanarak onu bir PNG / JPG'ye dönüştürebilirsiniz. Test etmek için herhangi bir yolum yok, ancak elde edilen bitler , alttaki sıkıştırma algoritması ve cihazın piksel yoğunluğu nedeniyle farklı olabilir .

Her zaman kullanıcıya sorabilirsiniz ?!

Kullanıcı düğmeleri veya içeriği göremezse, ölçeklendirmeyi kendileri yönetmeleri için bir yol verin. İçeriği (metin / düğmeler) daha büyük / daha küçük yapmak için siteye her zaman bazı ölçekleme düğmeleri oluşturabilirsiniz. Bu (neredeyse) mevcut herhangi bir iPad çözünürlüğü için çalışacağı garanti edilir ve muhtemelen gelecekteki herhangi bir çözünürlük elma yapmak istediklerine karar verir.

Bu, sorunuzun sorulduğu gibi bir cevap değildir, ancak umarım "bunu yapma" demekten daha yararlı olacaktır:

İPad Mini'yi tespit etmek yerine, neden bir kullanıcının kontrole vurmakta zorlandığını (veya: kontrolün bir alt bölgesine sürekli olarak vurduğunu) ve bunları barındırmak için kontrolün boyutunu büyütüp küçülttüğünü neden algılamıyorsunuz?

Daha büyük denetimlere ihtiyaç duyan kullanıcılar, donanıma bakılmaksızın onları alır; daha büyük denetimlere ihtiyaç duymayan ve daha fazla içerik görmek isteyen kullanıcılar da bunu elde eder. Sadece donanımı tespit etmek kadar basit değil ve doğru olması için bazı ince şeyler olacak, ancak dikkatli bir şekilde yapıldıysa gerçekten güzel olabilir.

Bu bana Denge filminden bir alıntı hatırlatıyor:

"Bir silahı Grammaton Din Adamından uzaklaştırmanın en kolay yolu nedir?"

"Ondan isteyin."

Çözümler için savaşmaya çok alışkınız, bazen sormak daha iyi olabilir. (Bunu genellikle yapmamamız için iyi nedenler vardır, ancak her zaman bir seçenektir.) Buradaki tüm öneriler mükemmeldir, ancak basit bir çözüm, programınızın başlatıldığında hangi iPad'i kullandıklarını sormasını sağlamak olabilir. .

Bunun bir tür arsız cevap olduğunu biliyorum, ama umarım her şey için savaşmamız gerekmediğini hatırlatırız. (Kendimi downvotes için hazırladım.: P)

Bazı örnekler:

• İşletim sistemi yüklemeleri sırasında klavye algılaması bazen belirli bir klavyeyi algılayamaz, bu nedenle yükleyicinin sorması gerekir.
• Windows bağlandığınız bir ağın ev ağı mı yoksa genel ağ mı olduğunu sorar.
• Bilgisayarlar kullanmak üzere olan kişiyi algılayamaz, bu nedenle bir kullanıcı adı ve şifre gerektirir.

İyi şanslar - Umarım harika bir çözüm bulursunuz! Eğer bunu yapmazsan, bunu unutma.

Soruyu cevaplamamak ama sorunun ardındaki soru:

Amacınız daha küçük bir ekranda kullanıcı deneyimini geliştirmektir. UI kontrollerinin görünümü bunun bir parçasıdır. UX'in bir diğer kısmı uygulamanın yanıt verme şeklidir.

UI kontrollerinin görsel sunumunu iPad'de görsel olarak memnun edecek kadar küçük tutarken, dokunmalara yanıt veren alanı iPad Mini'de kullanıcı dostu olacak kadar büyük yaparsanız ne olur?

Görsel alanda bulunmayan yeterli sayıda musluk topladıysanız, UI Denetimlerini görsel olarak ölçeklendirmeye karar verebilirsiniz.

Bonus olarak, bu iPad'de büyük eller için de geçerlidir.

Buradaki tüm çözümler geleceğe dönük değildir (Apple'ın iPad 2 ile aynı ekran boyutuna ancak iPad Mini ile aynı çözünürlüğe sahip bir iPad yayınlamasını engelleyen). Bu yüzden bir fikir buldum:

1 inç genişliğinde bir div oluşturun ve gövdeye ekleyin. Sonra% 100 genişliğinde başka bir div oluşturun ve vücuda ekleyin:

var div1= $("<div/>").appendTo(document.body).width("1in");
var div2= $("<div/>").appendTo(document.body).width("100%");

jQuery width () işlevi her zaman değerleri piksel cinsinden döndürür, böylece şunları yapabilirsiniz:

var screenSize= div2.width() / div1.width();

screenSize şimdi uygulama için mevcut boyutu inç olarak tutar (yine de yuvarlak hatalara dikkat edin). GUI'nizi istediğiniz gibi yerleştirmek için bunu kullanabilirsiniz. Ayrıca daha sonra işe yaramaz div'leri kaldırmayı unutmayın.

Ayrıca, Kaspars tarafından önerilen algoritmanın yalnızca kullanıcı uygulamayı tam ekran olarak çalıştırdığı zaman işe yaramayacağını, aynı zamanda Apple'ın tarayıcı arayüzüne yama yapmasını da sağlayacağını unutmayın.

Bu, cihazları ayırt etmez, ancak düzenlemenizde açıkladığınız gibi, aslında bilmek istediğiniz şey cihaz ekran boyutudur. Benim fikrim de tam olarak ekran boyutunu söylemeyecek, ancak GUI'nizi çizmek için mevcut olan gerçek boyut (inç cinsinden) size daha da yararlı bir bilgi verecektir.

DÜZENLE: Cihazınızda gerçekten çalışıp çalışmadığını kontrol etmek için bu kodu kullanın. Test etmek için iPad'im yok.

var div1= $("<div/>").appendTo(document.body).width("1in").height("1in").css("position", "absolute");
var div2= $("<div/>").appendTo(document.body).width("100%").height("100%").css("position", "absolute");
var width= div2.width() / div1.width()
var height= div2.height() / div1.height()
alert(Math.sqrt(width*width + height*height));

Ekran boyutunuzu inç olarak gösteren bir pencere açmalıdır. Dizüstü bilgisayarımda çalışıyor gibi görünüyor, dizüstü bilgisayar ekranım 15.4 '' olarak pazarlanırken 15.49 döndürüyor. Herkes bunu iPad'lerde test edebilir ve yorum gönderebilir mi? Tam ekran çalıştırmayı unutmayın.

EDIT2: Test ettiğim sayfanın çakışan bir CSS'si olduğu ortaya çıktı . Test kodunu şimdi düzgün çalışacak şekilde düzelttim. Pozisyona ihtiyacınız var: div'de mutlak, böylece yüksekliği% olarak kullanabilirsiniz.

EDIT3: Biraz araştırma yaptım ve ekranın boyutunu herhangi bir cihazda almanın bir yolu yok gibi görünüyor. İşletim sisteminin bildiği bir şey değil. CSS'de gerçek bir dünya birimi kullandığınızda, aslında ekranınızın bazı özelliklerine dayanan bir tahmindir. Bunun hiç de doğru olmadığını söylemeye gerek yok.

Test edilmedi, ancak bir ses dosyasını çalmak ve dengeyi kontrol etmek yerine mikrofonu dinlemek, arka plan gürültüsünü çıkarmak ve "rengini" (frekans grafiği) hesaplamak işe yarayabilir. IPad Mini'nin IPad 2'den farklı bir mikrofon modeli varsa, arka plan renkleri ölçülebilir derecede farklı olmalıdır ve bazı ses parmak izi teknikleri hangi cihazın kullanımda olduğunu söylemenize yardımcı olabilir.

Bu özel durumda uygulanabilir ve güçlük çekebileceğini ciddi olarak düşünmüyorum, ancak arka plan gürültüsünün parmak izinin bazı uygulamalarda kullanılabileceğini düşünüyorum , örneğin bir binanın içindeyken nerede olduğunuzu söylemek için.

Douglas'ınnew webkitAudioContext().destination.numberOfChannels iPad 2 ile ilgili sorusuna dayanarak bazı testler yapmaya karar verdim.

Kanal kontrolleri 2iPad mini'de döndü , ancak iOS 5 ve 2iOS 6 ile iPad 2'de hiçbir şey döndürmedi .

Sonra webkitAudioContext'in kullanılabilir olup olmadığını kontrol etmeye çalıştım

var hasWebkitAudio = typeof(webkitAudioContext) === "object";
alert(hasWebkitAudio);​

Aynı şekilde iOS 6 ile iPad Mini ve iPad 2 doğru, iOS 5 ile iPad 2 ise yanlış döner.

(Bu test masaüstünde çalışmaz, webkitAudioContext'in bir işlev olup olmadığını masaüstü kontrolü için).

Denemeniz için kod İşte: http://jsfiddle.net/sqFbc/

1 "x1" genişliğinde bir grup div oluşturduysanız ve sınırlayıcı kutu 1 inçten 2 inç'e atlayana kadar bunları tek tek bir üst div öğesine eklediyseniz ne olur? Mini bir inç, iPad'deki bir inç ile aynı boyutta, değil mi?

İOS7'de, kullanıcının ayarlayabileceği sistem çapında bir ayar var: işler okunamayacak kadar küçük olduğunda, Metin Boyutu ayarı değiştirilebilir.

Bu metin boyutu, örneğin bir düğme (Metin Boyutu ayar değişikliklerine tepki vermek için iPad Mini Retina'da test edilmiştir) için makul boyutlarda kullanıcı arayüzü oluşturmak için kullanılabilir:

padding: 0.5em 1em 0.5em 1em;
font: -apple-system-body;    

( örnek düğmesi CSS, jsfiddle ve cssbuttongenerator sayesinde)

İPad mini'nin oluşturabileceği daha büyük bir tuval oluşturarak , bir pikseli doldurarak ve rengi yeniden okuyarak iPad mini'yi tespit ediyorum . İPad mini rengi '000000' olarak okur. diğer her şey dolgu rengi olarak oluşturuyor.

Kısmi kod:

function rgbToHex(r, g, b) {
    if (r > 255 || g > 255 || b > 255)
        throw "Invalid color component";
    return ((r << 16) | (g << 8) | b).toString(16);
}
var test_colour = '8ed6ff';
working_context.fillStyle = '#' + test_colour;
working_context.fillRect(0,0,1,1);
var colour_data = working_context.getImageData(0, 0, 1, 1).data;
var colour_hex = ("000000" + rgbToHex(colour_data[0], colour_data[1], colour_data[2])).slice(-6);

Tuval boyutlandırma için buna ihtiyacım var, bu yüzden kullanım durumumda özellik algılama.