На просторах англоязычного интернета наткнулся на javascript библиотеку с говорящим названием CssUserAgent. Если говорить вкратце, то при загрузке страницы на тег html навешиваются классы следующего вида:
Под катом описание профита.
Как я уже сказал, при загрузке страницы с данным скриптом на тег html навешивается ряд классов, пример можно посмотреть по ссылке. Лично для меня результат был таков:
Для мобильных браузеров дополнительно будет добавлена еще пара классов:
Что же кроме лишнего кода мы получим?
Во-первых, нам доступен объект cssua.userAgent, имевший в моем случае следующий вид:
Так что теперь можно легко и просто определять как версию IE:
так и мобильные браузеры
А во-вторых, немного проще становится работа с css-кодом, который может зависеть от браузера:
Надеюсь, эта библиотека окажется вам полезной!
ua-browsername
ua-browsername-major
ua-browsername-major-minor
ua-browsername-major-minor-build
ua-browsername-major-minor-build-revision
Под катом описание профита.
Как я уже сказал, при загрузке страницы с данным скриптом на тег html навешивается ряд классов, пример можно посмотреть по ссылке. Лично для меня результат был таков:
<!-- the CSS classes currently applied to this page tag are: -->
<html class="ua-webkit ua-webkit-534 ua-webkit-534-15 ua-chrome ua-chrome-10 ua-chrome-10-0 ua-chrome-10-0-612 ua-chrome-10-0-612-3">
<head>…</head>
<body>…</body>
</html>
Для мобильных браузеров дополнительно будет добавлена еще пара классов:
<html class="… ua-mobile ua-mobile-iphone …">…<html>
Что же кроме лишнего кода мы получим?
Во-первых, нам доступен объект cssua.userAgent, имевший в моем случае следующий вид:
cssua.userAgent = { webkit: "534.15", chrome: "10.0.612.3" };
Так что теперь можно легко и просто определять как версию IE:
if (cssua.userAgent.ie < 8) { /* немного магии */ }
так и мобильные браузеры
if (cssua.userAgent.mobile) { /* еще немного магии */ }
А во-вторых, немного проще становится работа с css-кодом, который может зависеть от браузера:
.logo-area
{
background-image: url(logo.png);
background-repeat: no-repeat;
background-position: left top;
}
/* для IE 5.0, 5.5, 6.0 */
.ua-ie-5 .logo-area,
.ua-ie-6 .logo-area
{
/* версии IE < 7.0 плохо работают с 24-битными PNG */
background-image: url(logo.gif);
}
Надеюсь, эта библиотека окажется вам полезной!
