Предлагаем вашему вниманию очередную подборку с ссылками на новости, интересные материалы и полезные ресурсы.
Рубрика «html5» - 60
Дайджест интересных новостей и материалов из мира айти за последнюю неделю №44 (9 — 15 февраля 2013)
2013-02-15 в 19:49, admin, рубрики: css, css3, harlem shake, html, html5, jquery, JS, opera, WebGL, webkit, Блог компании Zfort Group, браузеры, веб-аналитика, веб-дизайн, Веб-разработка, дайджест, Интересное, Новости, ресурсы, ссылки, ссылки на сми, метки: css, css3, harlem shake, html, html5, jquery, opera, WebGL, webkit, браузеры, веб-дизайн, Веб-разработка, дайджест, интересное, новости, ресурсы, ссылки, ссылки на сми.png "Дайджест интересных новостей и материалов из мира айти за последнюю неделю №44 (9 — 15 февраля 2013)")
Визуальное редактирование данных на странице, используя HTML как хранилище данных
2013-02-15 в 14:44, admin, рубрики: html, html5, java, javascript, jQuery UI, web-services, Блог компании «ETNA Software», метки: html5, java, javascript, jQuery UI, web-servicesКогда нам нужно предоставить пользователю возможность графического редактирования содержимого на странице, пожалуй, чаще всего мы используем JavaScript для хранения данных и передачи их на сервер, и все споры ведутся вокруг способа отображения, внешнего вида редактора. Наш выбор простирается от простого HTML (с холстом или без) до встроенного SVG или использования Flash плеера.
Выбрать между этими вариантами не сложно: SVG подойдёт для схем или планов и другой векторной графики, холст больше подходит для фотографий или других изображений. Однако, оба этих элемента требуют «отделения» себя от страницы. Под «отделением» я имею ввиду то, что любой из этих элементов требует написания дополнительных сценариев для синхронизации вида с моделью.
Для небольших объектов, структура которых хорошо описывается деревом или списком (например, корзина покупателя или бизнес-процесс), использование HTML элементов для отображения и хранения данных могло бы упростить разработку и поддержку.
Читать полностью »
Переходим с Flash на Edge — сравнение двух платформ для создания анимации
2013-02-13 в 12:51, admin, рубрики: adobe, edge, flash, html5, Анимация и 3D графика, Софт, метки: adobe, edge, flash, html5В статье идет речь о сравнении Adobe Edge и Adobe Flash с точки зрения аниматора.
После нескольких лет работы над баннерной рекламой в среде Adobe Flash, я решил освоить и свежий Adobe Edge, собрата, работающего со стандартом HTML5. Для того, чтобы познакомится с Edge, я освоил встроенные уроки и просмотрел обучающий курс от Lynda. Далее мои впечатления от продукта в срезе сравнения Edge с Flash из CS6 (замечу, что работал я в нем с классическими твинами).
Мини-игра с отслеживанием положения головы или как я встретил headtrackr.js
2013-02-13 в 8:56, admin, рубрики: headtracking, html5, javascript, Программирование, распознавание лиц, робототехника, метки: headtracking, html5, javascript, Программирование, распознавание лиц 
11.02.2013 г. читатель omfg опубликовал статью, с которой началось мое знакомство с headtrackr.js.
В этом топике я расскажу, как средствами браузера с поддержкой getUserMedia получить координаты и угол наклона головы пользователя перед монитором, как учесть дефекты изображения, принимаемого с веб-камеры и отфильтровать их, и как использовать данную технологию в своих пректах, задействовав лишь html + JavaScript.
Применений этому можно придумать огромное количество. Для простоты, в данном топике мы сделаем мини-игру, в которой змейка будет ползти сверху вниз и менять направление в зависимости от положения головы играющего.
Самым нетерпеливым: результат тут.
Читать полностью »
Отзывчивый дизайн с помощью камеры
2013-02-11 в 16:06, admin, рубрики: html5, javascript, responsive design, responsive web design, Typekit, video streaming, web camera, webm, веб-дизайн, Веб-разработка, метки: html5, javascript, responsive design, responsive web design, Typekit, video streaming, web camera, webm 
Боитесь, что пользователь не сможет прочитать текст на вашем сайте издалека? Не вопрос, посмотрите на это (необходима камера и поддержка WebM).
При помощи WebM и скрипта для распознования лиц HeadTrackr можно легко сделать дизайн, который будет подстраиваться под пользователя в зависимости от его отдаленности от монитора. Это ли не будущее?
Дайджест интересных новостей и материалов из мира айти за последнюю неделю №43 (2 — 8 февраля 2013)
2013-02-08 в 21:22, admin, рубрики: css, css3, Facebook, html, html5, jquery, JS, microsoft, Блог компании Zfort Group, браузеры, будущее, веб-дизайн, Веб-разработка, дайджест, Интересное, Новости, ресурсы, ссылки, ссылки на сми, метки: css, css3, Facebook, html, html5, jquery, microsoft, браузеры, будущее, веб-дизайн, Веб-разработка, дайджест, интересное, новости, ресурсы, ссылки, ссылки на смиПредлагаем вашему вниманию очередную подборку с ссылками на новости, интересные материалы и полезные ресурсы.
.png "Дайджест интересных новостей и материалов из мира айти за последнюю неделю №43 (2 — 8 февраля 2013)")
Изометрический сапёр на LibCanvas (html5)
2013-02-08 в 3:19, admin, рубрики: AtomJS, canvas, html5, javascript, LibCanvas, Анимация и 3D графика, сапёр, метки: AtomJS, Canvas, html5, javascript, LibCanvas, сапёр .gif "Изометрический сапёр на LibCanvas (html5)")
Этот топик будет отличаться от предыдущего топика Классический сапёр на html5 и LibCanvas. Его даже, скорее, можно назвать продолжением. И первая часть содержала пошаговую и детальную инструкцию, как заставить работать игрушку, то в этой части будет пару интересных приёмов, как её «оказуалить».
Играть в изометрический «Сапёр»
Если вы новичёк в этом деле, то стоит начинать с первой части. Для тех, кто хочет углублятся я рассмотрю следующие темы на примере изометрического сапёра, построеного на базе LibCanvas:
- Изометрическая проекция
- Оптимизация скорости отрисовки через грязный хак
- Спрайтовые анимации
- Draggable слои
- Оптимизация обработчика мыши согласно особенностей приложения
Google Chrome Frame и большой Canvas
2013-02-06 в 16:44, admin, рубрики: canvas, Google Chrome, html5, internet explorer, javascript, метки: Canvas, html5, Internet Explorer, javascript Необходимо к проекту подключить Google Chrome Frame. Проект полностью на Canvas, огромные полотна. Всё отлично, он всё подхватывает, если бы не одна проблема. <canvas> работает ровно до того момента, пока его площадь не перевалит за 216. То, есть, скажем, холст размером 256*256 — работает без малейших нареканий. Стоит поставить размер 257*256 — отрисовка не происходит или происходит только один раз.
Проверял на IE7 и IE8.
Вот ссылка для теста: theshock.github.com/trash/chrome-frame-fail.html
Вот пример того, как оно выглядит в IE8:
Классический сапёр на html5 и LibCanvas
2013-02-06 в 3:14, admin, рубрики: AtomJS, canvas, game development, html5, javascript, LibCanvas, метки: AtomJS, Canvas, html5, javascript, LibCanvas 
В этой статье я пошагово расскажу, как писать самый обычный, классический сапёр при помощи Html5 Canvas, AtomJS, и тайлового движка LibCanvas.
Читать полностью »
Бернерс-Ли: Нет рута? Твое устройство служит другим
2013-02-04 в 12:28, admin, рубрики: html5, mobile development, бернерс-ли, Блог компании «Apps4All», мобильная разработка, Смартфоны и коммуникаторы 
«Право иметь root на твоей машине», полные административные привилегии доступа к устройству, например, такому как смартфон, «ключевой вопрос», — сказал Тим Бернерс-Ли аудитории конференции Linux.conf.au 2013 в Канберре.
«Право иметь рут на твоей машине это право на владение вещью, которой ты можешь распоряжаться по своему усмотрению», — отметил он.Читать полностью »