Wykorzystanie Modernizr do testów na tablet I komórkę - opinie poszukiwane

Chcę użyć Modernizr, aby wykryć, czy użytkownik przegląda stronę na komputerze, tablecie lub urządzeniu mobilnym.

Moje pierwsze myśli są oczywiście, aby sprawdzić rozmiary ekranu, które powinny być wystarczające dla urządzeń mobilnych, a także dla większych komputerów stacjonarnych. W przypadku tabletów, w których rozmiar ekranu może być równy niewielkiemu ekranowi pulpitu (1024 x 768), testowałbym również zdarzenia dotykowe.

W tej chwili chciałbym skupić się na urządzeniach mobilnych/tabletach, które, jak to ujął jQuery mobile są, A-Klasa. Nie chcę korzystać z żadnych konkretnych funkcji urządzenia mobilnego, po prostu wykrywaj komputer stacjonarny, tablet lub telefon komórkowy i serwuj dostosowany interfejs użytkownika dla każdego, dodając klasy CSS w zależności od wyników testu.

Czy uważasz, że to wystarczy, aby osiągnąć to, czego chcę, czy uważasz, że powinienem testować inne możliwości? Z góry dziękuję.

Author: Ilmari Karonen, 2011-10-28
Source

4 answers

Modernizr może sprawdzać zdarzenia dotykowe

Do testowania, czy urządzenie jest tablet, telefon lub komputer stacjonarny, prawdopodobnie skłaniałbym się bardziej w kierunku korzystania z agentów Użytkownika. Spójrz na Skrypty na DetectMobileBrowsers.com

Modernizr po prostu sprawdza, czy przeglądarka obsługuje pewne funkcje. Z tego co wiem, to chyba nie testuje browser_type == mobile i tak dalej...

Należy pamiętać, że wiele nowoczesnych komputerów stacjonarnych w dzisiejszych czasach ma dotyk ekranów, więc nawet wykrywanie obsługi dotykowej nie gwarantuje, że jest to urządzenie mobilne lub tablet.

 36
Author: Jake Wilson,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-05-03 14:46:03

To pytanie jest trochę stare, ale nie mogłem znaleźć lepszej odpowiedzi, gdy go wygooglowałem.

Większość komputerów stacjonarnych ma teraz włączoną obsługę dotykową, więc jej wykrywanie jest nieistotne.

Najlepszym sposobem ich wykrycia jest rozmiar ekranu.

Z Modernizr możesz użyć if (Modernizr.mq('only all and (max-width: 480px)')) { ...}

 46
Author: Carlos Martinez T,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-02-02 12:11:17

Możesz użyć następującego rozszerzenia dla Modernizr: https://www.npmjs.org/package/mobile-detect

Lub (bez Modernizr) można użyć Restive.JS, aby dodać".telefon "lub".tablet" - klasa dla Twojego ciała: http://docs.restivejs.com

(poszukaj "formfactor" na dole strony.)

 4
Author: tFranz,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-03-18 11:07:04

Jest to kontynuacja odpowiedzi na Stare pytanie, ponieważ wierzę, że "poprawna" odpowiedź zmieniła się z czasem.

    Wiele laptopów jest obecnie obsługiwanych przez dotyk.]}
  • nowsze telefony komórkowe mają wyższe rozdzielczości niż większość monitorów komputerowych, a jednocześnie mają znacznie mniejszy ekran fizyczny

Najlepszym sposobem, jaki znalazłem, aby obejść to jest obliczenie fizycznego rozmiaru ekranu przez pomnożenie DPI ekranu w połączeniu z rozmiarem ekranu w pikseli.

 0
Author: Oskar Sjöberg,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-09-12 14:28:26