Modernizr — это небольшая библиотека JavaScript, которая определяет наличие собственных реализаций для веб-технологий следующего поколения.
В HTML5 и CSS3 появилось несколько новых функций, но в то же время многие браузеры не поддерживают эти функции новостей.
Modernizr предоставляет простой способ обнаружить любую новую функцию, чтобы вы могли предпринять соответствующие действия. Например, если браузер не поддерживает функцию видео, вы хотели бы отобразить простую страницу.
Вы можете создавать правила CSS на основе доступности функции, и эти правила будут автоматически применяться на веб-странице, если браузер не поддерживает новую функцию.
Вы можете скачать последнюю версию этой утилиты от Modernizr Download .
Синтаксис
Перед тем, как вы начнете использовать Modernizr, вам нужно будет включить его библиотеку JavaScript в заголовок вашей HTML-страницы следующим образом:
<script src="modernizr.min.js" type="text/javascript"></script>
Как уже упоминалось выше, вы можете создавать правила CSS на основе доступности функции, и эти правила будут автоматически применяться на веб-странице, если браузер не поддерживает новые функции.
Ниже приведен простой синтаксис для обработки поддерживаемых и не поддерживаемых функций.
/* In your CSS: */
.no-audio #music {
display: none; /* Don't show Audio options */
}
.audio #music button {
/* Style the Play and Pause buttons nicely */
}
<!-- In your HTML: -->
<div id="music">
<audio>
<source src="audio.ogg" />
<source src="audio.mp3" />
</audio>
<button id="play">Play</button>
<button id="pause">Pause</button>
</div>
Здесь следует отметить, что вам нужно добавить префикс «no-» к каждой функции / свойству, которые вы хотите обработать для браузера, который их не поддерживает.
Ниже приводится синтаксис для обнаружения конкретной функции с помощью Javascript —
if (Modernizr.audio) {
/* properties for browsers that
support audio */
}
else{
/* properties for browsers that
does not support audio */
}
Особенности, обнаруженные Modernizr
Ниже приведен список функций, которые могут быть обнаружены Modernizr —