Tag Archives: html5

Chrome Fullscreen API

Всё сводится к вызову:

function launchIntoFullscreen(element) {
  if(element.requestFullscreen) {
    element.requestFullscreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullscreen) {
    element.webkitRequestFullscreen();
  } else if(element.msRequestFullscreen) {
    element.msRequestFullscreen();
  }
}

function launchIntoFullscreen(element) {

if(element.requestFullscreen) {

element.requestFullscreen();

} else if(element.mozRequestFullScreen) {

element.mozRequestFullScreen();

} else if(element.webkitRequestFullscreen) {

element.webkitRequestFullscreen();

} else if(element.msRequestFullscreen) {

element.msRequestFullscreen();

}

Но при этом есть нюанс использования: включить полноэкранный режим можно только в ответ на действие пользователя. http://davidwalsh.name/fullscreen http://stackoverflow.com/questions/7836204/chrome-fullscreen-api

Проверка поддержки html5-свойств конкретным браузером

http://html5test.com/ — проверяет поддержку всего, что есть в спецификациях html5, в текущем браузере. Удобно для работы с мобильными браузерами. Удобнее, чем выискивать на http://caniuse.com, а ещё лучше в связке.

Статья про Web Notifications

http://www.inserthtml.com/2013/10/notification-api/

Как правильно работать с Shadow DOM

Как смотреть Google Chrome DevTools → Настройки → General → Show Shadow DOM. Как пользоваться

HTML5-видео для чайников

http://www.catswhocode.com/blog/cross-browser-compatible-html5-videos

HTML5: Геолокация вкратце

http://www.sitepoint.com/using-the-html5-geolocation-api/

Все HTML5-типы input’ов одним списком

search email url tel number range date month week time datetime datetime-local color http://html5doctor.com/html5-forms-input-types/

Shadow Dom is real doom

Описание нового стандарта из раздела WebComponents — http://www.html5rocks.com/en/tutorials/webcomponents/shadowdom/. Очень надеюсь, что не получит большого распространения. Минусы: SEO — поисковики к такому формату не приучены, и не факт, что будут хорошо работать Проинспектировав текущий элемент, увидишь совсем не то, что отрисовано Жуткий, неудобный синтаксис (особенно расширенный синтаксис — http://www.html5rocks.com/en/tutorials/webcomponents/shadowdom/#toc-projection) Итог. Неочевидно, для чего нужен, если для …

WebRTC

WebRTC — проект, который позволяет получать медиаданные (аудио и видео) через браузер и устанавливать Peer-to-Peer соединение между двумя и более клиентами, через которое могут передаваться обычные данные и медиапотоки. По сути, WebRTC являет собой: 1. Media Streams (getUserMedia). 2. Peer Connection. Обзор — http://habrahabr.ru/post/163527/

10 html5 API, о которых не все знают

Не самые известные html5 API. Element.classList — упрощённое управление CSS-классами из javascript

// Add a class to an element
myElement.classList.add("newClass");

// Remove a class to an element
myElement.classList.remove("existingClass");

// Check for existence
myElement.classList.contains("oneClass");

// Toggle a class
myElement.classList.toggle("anotherClass");

// Add a class to an element

myElement.classList.add("newClass");

// Remove a class to an element

myElement.classList.remove("existingClass");

// Check for existence

myElement.classList.contains("oneClass");

// Toggle a class

myElement.classList.toggle("anotherClass");