На просторах англоязычного интернета наткнулся на 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); }
Надеюсь, эта библиотека окажется вам полезной!