Как лучше всего определить мобильное устройство?

Question

[Jkristo ‣]

Как лучше задать условие и определить, что пользователь зашел на сайт с мобильного или планшета? Кроме ширины, этот параметр пересекается уже кажется в 1024.
т.е. что нет hover и т.д. а есть Tap вместо клика. Задача убирать title атрибут например:

if (innerWidth < 1024 && .... тут определить ) {
$(.selector).removeAttr('title');
}

На js или с jquery не имеет значения.

Answer 1

[Александр]

https://stackoverflow.com/questions/11381673/detec...

Comments

[Jkristo ‣]

Первое же решение - все, вроде бы хорошо, но не определяеться сафари наайпаде, самое важное по сути.
Не подскажете как его добавить туда что ли?
Накидал тестовую страничку, с разными проверками:
https://check-mobile-or-not.web.app
но крашится сафари.

[Александр]

Jkristo ‣, продебажте на айпаде userAgent и добавьте в список

Но это все равно не самый хороший способ, он отталкивается от данных, передаваемых браузером фронту. Завтра эпл уберет эту информацию и все ляжет. Лучше использовать ширину. А можно и вместе (если регулярка выдает false - проверяете ширину экрана)

[Jkristo ‣]

Я просто подумал, что не актуально ширину использовать, например как раньше 1024
Вот поэтому:
https://kapeli.com/cheat_sheets/iOS_Design.docset/...

некоторые новые модели Ipad'a вообще заваливают: 2732 x 2048 px
больше многих мониторов.

А как продебажить на айпаде userAgent не подскажете? Это в настройках сафари чтоли искать?
да и на руках третий только старичек.

[Александр]

Jkristo ‣, во-первых, есть такая вещь как плотность пикселей. На телефоне с разрешением 4к не будет подгружаться контент от 4к монитора (https://youtu.be/6snyo6ZqryE?t=299 ). Если вы посмотрите на столбец "Portrait Logical Resolution" для самого большого ipad (iPad Pro 12.9-inch), то разрешение, которое будет (грубо говоря) показываться через js - 1024, что и является верхним пределом для планшетов.

Для того что бы узнать что будет подгружаться для девайса - сделайте на странице alert с шириной страницы из js, так же вы можете узнать userAgent.
alert(navigator.userAgent);

А беспокоиться уже о изменении разрешения для js в зависимости от устройства не стоит, создатели айфонов и айпадов не совсем идиоты и понимают, что если они сейчас долбанут фактическое и js разрешение одинаково, то 99% сайтов и приложений просто не будут отображать контент в нормальном виде и пользоваться таким устройством будет невозможно

[Jkristo ‣]

Александр,

Не под тем углом смотрел на проблему, воспринимал эти большие разрешения, как то, что по факту отловит media queries. Всё оказалось куда проще. Спасибо!