Обнаружение мобильного браузера, совершающего запрос на вызов - PullRequest
3 голосов
/ 03 ноября 2011

Я пытаюсь сделать сайт. Обязательным является то, что он должен работать на Iphone, Android, Samsung Galaxy S / S2, Ipad, Samsung Galaxy Tab и т. Д. и должен дать такой же опыт. Есть ли способ определить, какой мобильный браузер запрашивает страницу, и, соответственно, применить CSS, созданный для него, с помощью Jquery? Я хотел бы строго использовать только HTML5, Jquery, CSS3.

Ответы [ 4 ]

5 голосов
/ 03 ноября 2011

Ваша таблица стилей по умолчанию в верхней части страницы

 <link rel="stylesheet" href="default.css" type="text/css">

Расширьте библиотеку jquery для обнаружения iphone / ipad

 <script type="text/javascript">
      jQuery.extend(jQuery.browser,
      {SafariMobile : navigator.userAgent.toLowerCase().match(/iP(hone|ad)/i) }
 );
 </script>

, затем проверьте, имеет ли браузер тип иизмените таблицу стилей соответственно

 <script type="text/javascript">
      $(function(){
        if($.browser.SafariMobile){
          $("link[rel=stylesheet]").attr({href : "iphone.css"});
        }
      })
 </script>
2 голосов
/ 03 ноября 2011

Вам понадобятся медиазапросы CSS3 для определения ширины устройства, его разрешения и ориентации.Хорошей отправной точкой для вас является мобильная боилплейт - http://html5boilerplate.com/mobile

0 голосов
/ 03 ноября 2011

То, что вы пытаетесь сделать в общем случае, чрезвычайно сложно.Проблема не в обнаружении браузера.Браузер может быть обнаружен с помощью любого из методов, указанных выше.Но получить ширину и размеры экранов и реальные возможности поддержки HTML гораздо сложнее.

Существует проект с открытым исходным кодом, называемый WFURL , который поддерживает базу данных всех поддерживаемых устройств и ихвозможности интеграции и могут быть использованы.

Что мы делаем, так это используем фреймворк, такой как JQuery Mobile , который автоматически дает похожий внешний вид в различных телефонах.Однако этот фреймворк все еще очень сырой.

Способ, которым большинство сайтов, таких как Mercedes Benz, ebay, mtv india, google и т. Д., Делают это, используя что-то вроде [NetBiscuits] (http://www.netbiscuits.com/) для разработки своих мобильных сайтов.Таким образом, они пишут код один раз (хотя и на BiscuitML), а NetBiscuits выполняет работу по обнаружению мобильного устройства и оптимизации сайта. Например, ознакомьтесь с этой ссылкой клиентов, использующих NetBiscuits.

NetBiscuitsвозможно, это не единственная инфраструктура, которая делает это (я знаю, что IBM предоставляет решение в качестве части своего веб-портала), однако это самая популярная из известных мне систем.

0 голосов
/ 03 ноября 2011

Вы можете использовать следующие операторы для получения информации о браузере.

$_SERVER['HTTP_USER_AGENT']

ИЛИ

$browser = get_browser(null, true);
print_r($browser);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...