Jump to content

Detect Mobile Browsers


npofopr
 Share

Recommended Posts

Помогите определить мобильные браузеры.

Вообще, хочу на ПК показывать флеш, а для мобильников показывать слайдер.

Через php нашел вот https://github.com/serbanghita/Mobile-Detect

В принципе тут все понятно, подключаю


<?php
include 'Mobile_Detect.php';
$detect = new Mobile_Detect();

а дальше уже через php определяю и нужные блоки, например, скрываю.

Но хочется сделать через js.

Тут вроде как тоже есть хорошая сборка http://detectmobilebrowsers.com

Если смотреть для Jquery.

Как мне функцию привязать к этому скрипту?)

(function(a){(jQuery.browser=jQuery.browser||{}).mobile=/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))})(navigator.userAgent||navigator.vendor||window.opera);

На подобие:


function is_mobile(){
var a {(jQuery.browser=jQuery.browser||{}).mobile=/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))})(navigator.userAgent||navigator.vendor||window.opera);
}

Чтобы потом, в коде можно было указать


if($.is_mobile){
нужный контент
}

и по задумке, то что в if, будет например скрываться на мобилках.

Может это все можно по другому сделать? И намного проще.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Similar Content

    • By d0ublezer0
      Привет!
      https://www.zebra-tara.ru/about
      Внизу есть кнопка [Cкопировать], на неё навешен такой код:
      var $j = jQuery.noConflict(); $j("#legal-copy").on("click", function (e) { var text = $j("#legal-info").text().trim(); var $scroll = $j("window").scrollTop(); var temp_element = $j('<textarea>').appendTo("#legal-copy").val(text).select(); $j("window").scrollTop($scroll); document.execCommand('copy'); temp_element.remove(); $j(this).text("Скопировано").prepend("<i class='fa fa-check-circle'></i> ").addClass("green-btn"); }); Как ни бьюсь - не удается избавиться от прокручивания к создаваемому элементу textarea в мобильном браузере. Он получает :focus и мобильный браузер прокручивает страницу.
      Добавка ScrollTop мне не помогла
      Как выкрутиться?
    • By Alarr
      Люди добрые, подскажите, почему дизайнеры делают макеты мобильной версии начиная с 750 пикселей, с огромными шрифтами и картинками? Но при этом, хотят чтобы оно всё круто выглядело на 320px. 
      Как же правильно делать, дизайн на 320, а потом пускай расширяется? Или 750, а верстальщик пускай сам придумывает, как оно будет сжиматься до 320, и расширяться до 980ти?
      Как правильно делать дизайн мобильной версии, с какой шириной?
    • By twentyfive_agency
      Мы достаточная слаженная команда и работаем как единый механизм.
      Все члены команды обладают достаточной компетенцией, чтобы выполнять работы разного уровня сложности.
      Сейчас у нас в команде:
      4 Технолога/Верстальщика (html5, css3, javascript, reat, angular) 2 Проектировщика/Дизайнера (invision, photoshop, illustrator, sketch) 3 Бэкенд разработчика (php, nodejs, python + работа со всеми известными cms,crm-системами) 4 Мобильных разработчика (1 iOs, 1 Android) 2 Тестировщика Каждый из членов команды четко понимает ответственность за проект!
      Все задачи ведем в Basecamp, Trello и JIRA, и всегда добавляем туда заказчика, чтобы формировалась прозрачность работы.
      Процесс работы по проектам у нас такой:
      Получаем задание Оцениваем сроки и стоимость, предоставляем информацию в электронном виде заказчику. Согласуем эти данные или вносим корректировки. Подписываем договор (с нашей стороны ИП) Получаем аванс по договору Начинаем работу по проекту Ведем разработку проекта Показываем финальную итерацию заказчику и запускаем проект в продакшн. Остаемся довольными сотрудничеством и получаем отзывы по работе, слаженности и о качестве проекта в целом. Рейты работы наших специалистов:
      Проектирование/Дизайн // 700-800 руб/час Верстка/js  // 700-800 руб/час Программирование (бэкенд) // 700-1000 руб/час Тестирование // 400-650 руб/час Разработка приложений (iOS, Android) // 1000-1400 руб/час Мы работаем над тем, чтобы:
      Заказчик всегда был уверен в том, что сроки по проекту не выйдут за согласованные. Заказчик был уверен в том, что качество работ будет проведено на высшем уровне. Заказчик похвалил нас и сказал, что вернется еще или останется с нами на техподдержку. Наши работы:
      http://greenjam.ru http://tuborg.ru http://k1664.ru http://corny.ru http://megalabs.ru http://prostude.net http://ecorse.education http://eqeducation.org http://dadacreative.com http://tfg.ru/ http://pirelli.autonews.ru/ http://id-direct.ru http://localway.ru  
       
      Twenty Five Agency
      twentyfive.agency
      Georgy Pantsulaya, CEO
      via phone: +7-989-536-00-35
      via skype: hello@twentyfive.agency
    • By Alarr
      Честно, сейчас так много устройств, что кажется восстание машин уже началось и щимить они начали уже в вёрстке.
      Подскажите пожалуйста, что делать в такой ситуации:
      у iPadPro разрешение 1366х1024, у какого-нить ноутбука, к примеру, 1280х800.
      Так какую же версию сайта нужно отображать на Айпэд Про, если у него разрешение больше чем у ноутов?
      Я сделал отображение десктопной версии. Но тут заказчик посмотрел сайт с обычного айпэда, и говорит, что туда надо мобайл. И вот парадокс:
      iPadPro (protrait) - 1024x1366
      iPad (landscape) - 1024x768
      На один 1024 получается нужно повесить и десктопную и мобильную версию? Как?
      Тогда вопрос, может показывать на айпэд про мобильную версию? Но:
      Ноутбук 1280х800 - десктопная версия
      iPadPro (landscape) - 1366х1024
      У ноута разрешение меньше а версия десктопней так сказать...

      Что делать? Это пипец?
    • By Alarr
      Коллеги, может это я слишком часто натыкаюсь на такое, но почему-то все дизайнеры, поголовно, делают psd темплейт для мобильной версии сайта шириной в 900px, или 700 или 800.
      Почемууу? Ширина айфона 320, андроида 360, я обычно на такие цифры равняюсь. Ну ладно, можно допустить, что есть более широкие мобильные разрешения, но не делать же темплейт мобильной версии шириной в 900px!!!??? 
      Почему они так поступают и что с этим делать?
      Спасибо
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy