Независимо от того, какой вариант вы выберете, в первую очередь необходимо определить, доступны ли в браузере пользователя возможности HTML5, реализованные в вашем приложении. Новые возможности не зависят друг от друга, и проверить их наличие не составляет труда, однако техники распознавания настолько же разнообразны, как и сама функциональности HTML5. Разработчикам приходится учитывать разные версии множества браузеров и зависеть от кодов, которые зачастую оказываются не слишком надежными.
Для решения этой проблемы была разработана небольшая библиотека под названием Modernizr. Эта библиотека создает объект с именем Modernizr, включающий в себя свойства для каждой из возможностей HTML5. Эти свойства возвращают булево значение true или false в зависимости от того, доступна ли соответствующая возможность.
Данная библиотека поставляется с открытым кодом, она написана на языке программирования JavaScript, и вы можете бесплатно загрузить ее с веб-сайта http://www.modernizr.com. Всего лишь скопируйте на свой компьютер файл JavaScript и добавьте его в заголовок документа, как в следующем примере.
Листинг З.1. Добавление библиотеки Modernizr в документ
<!DOCTYPE html>
<html lang=»ru»>
<head>
<title>Modernizr</title>
<script src=»modernizr. min. js»></script>
<script src=»modernizr. js»></script>
</head>
<body>
<section id=»databox»> содержимое </section>
</body>
</html>
Файл под названием modernizr. min. js — это копия файла с библиотекой Modernizr, который мы загрузили с сайта создателей Modernizr. Второй файл, указанный в «голове» HTML-документа в листинге З.1, — это наш собственный JavaScript-код, проверяющий значения свойств, которые предоставляет библиотека.
Листинг З.2. Проверка доступности CSS-стилей для создания тени поля
Function initiate(){
Var databox=document. getElementById(‘databox’);
If(Modernizr. boxshadow){
Databox. innerHTML=’Тени для полей доступны;
}else{
Databox. innerHTML=’Тени для полей недоступны;
}
}
Window. addEventListener(‘load’, initiate, false);
Как видно из кода листинга З.2, определить наличие любой возможности HTML5 можно с помощью всего лишь условного оператора if и соответствующего свойства объекта Modernizr. Для каждой возможности предусмотрено отдельное свойство.
Это всего лишь краткое знакомство с потрясающе полезной библиотекой. Используя Modernizr, вы также можете выбирать наборы CSS-стилей из файлов CSS, не прибегая к помощи JavaScript. Modernizr предоставляет специальные классы, которые можно добавлять в таблицы стилей для выбора нужных свойств CSS в соответствии с перечнем доступных возможностей. Чтобы подробнее узнать об этом, зайдите на веб-сайт создателей библиотеки http://www.modernizr.com.
К слову, о ваших будущих и текущих проектах\сайтах: быстрый, безопасный и конечно же надежный хостинг является основой благополучия вашего сайта. Если вы ищите подобный хостинг на SSD для своих проектов – стоит обратить внимание на www.x-host.ua!
Добавить комментарий