Рубрика «html5» - 70

в 14:25, , рубрики: battery, html, html5, javascript, Веб-разработка

HTML5 спецификация наполняется и медленно начинают появляться API, позволяющие получать информацию об устройстве, на котором запущено приложение. Одиим из последних является Battery Status API. Как вы уже догадались, API позволяет получить информацию о батареи используя javascript. Так что теперь у вас есть возможность отключиться тяжелую анимацию на вашей странице, предложить пользователю сохранить данные или самому активно ее сохранять в локальное хранилище. Рабочий пример вы можете найти здесь. Следует заметить, что свойство «Battery time left», было недоступно, когда я открыл страницу. Но оно обновилось через пару минут.

Я тестировал это API с последних бета-версий Mozilla и оно пока не работает на Mac (но работает на iOS, Android и Windows). Так же мне не удалось получить положительный результат статуса зарядки, зато время разрядки и уровень батареи работали корректно. В этом мальньком примере мы просто отобразим информацию из API на простенькой странице, как эта (скрин из моей таблетки):

HTML5: Доступ к батареи через javascript

В этой статье мы рассмотрим:

  • Использование Battery API
  • Создание полей, для отображения информации из API
  • Создание картинки для отображение статуса батареи
  • Использование eventListener для обновления информации

Читать полностью »

в 14:25, , рубрики: battery, html, html5, javascript, Веб-разработка

HTML5 спецификация наполняется и медленно начинают появляться API, позволяющие получать информацию об устройстве, на котором запущено приложение. Одиим из последних является Battery Status API. Как вы уже догадались, API позволяет получить информацию о батареи используя javascript. Так что теперь у вас есть возможность отключиться тяжелую анимацию на вашей странице, предложить пользователю сохранить данные или самому активно ее сохранять в локальное хранилище. Рабочий пример вы можете найти здесь. Следует заметить, что свойство «Battery time left», было недоступно, когда я открыл страницу. Но оно обновилось через пару минут.

Я тестировал это API с последних бета-версий Mozilla и оно пока не работает на Mac (но работает на iOS, Android и Windows). Так же мне не удалось получить положительный результат статуса зарядки, зато время разрядки и уровень батареи работали корректно. В этом маленьком примере мы просто отобразим информацию из API на простенькой странице, как эта (скрин из моей таблетки):

HTML5: Доступ к батарее через javascript

В этой статье мы рассмотрим:

  • Использование Battery API
  • Создание полей, для отображения информации из API
  • Создание картинки для отображение статуса батареи
  • Использование eventListener для обновления информации

Читать полностью »

в 14:59, , рубрики: breeze, html5, javascript, localStorage, sessionstorage, метки: , , ,

Хочу представить вашему вниманию библиотеку для удобной работы с Local и Session Storage. Она появилась, как побочный продукт работы над проектом и содержит несколько довольно удобных функций. Библиотека поддерживает все современные браузеры, а именно:

  • Internet Explorer 8+
  • Mozilla Firefox 3.5+
  • Google Chrome 4+
  • Safari 4+
  • Opera 10.5+

Помимо традиционных — set/get/inc/dec, есть набор удобных «вкусностей»:

  • inc работает со строками
  • extend для объектов
  • много методов для работы с массивами
    • обычные append/prepend/takeLast/takeFirst/getLast/getFirst
    • с проверкой уникальности — .appendUnique/.prependUnique
    • во все append/prepend методы можно передавать лимит — удобно для организации MRU списков
  • calls chaining — я от него в восторге :)

Если заинтересовал — прошу под кат за примерами. Мне кажется они достаточно хорошо показывают возможности библиотеки.

Читать полностью »

в 10:20, , рубрики: flash, Flash-платформа, html, html5, mozilla, Shumway, SWF, конвертер, метки: , , , ,

Под аккаунтом Mozilla на github стартовала разработка open source проекта Shumway — это технологический эксперимент, в рамках которого исследуются возможности рендеринга SWF без использования нативного кода, то есть средствами HTML5 и JavaScript.

Mozilla надеется, что подобный инструмент всё-таки будет создан и будет использоваться повсеместно как всеобщий открытый стандарт для парсинга и рендернига Flash-анимации. Интеграция с Firefox возможна, если эксперимент окажется успешным.
Читать полностью »

в 22:02, , рубрики: html, html5, responsive web design, rwd, w3c, адаптивная вёрстка, адаптивная разметка, адаптивный дизайн, Веб-разработка, метки: , , , , , ,

HTML5 Адаптивные изображения

Адаптивные изображения одна из проблем Responsive Web Design. Возможно вы начали использовать high-res изображения для дисплеев с высоким разрешением и уменьшать их размер для устройств с меньшим разрешением дисплея, что попросту съедает трафик без какой либо пользы для владельцев устройств с дисплеями с небольшим разрешением. Или все так же используете изображения невысокого разрешения, которые ужасно смотрятся на больших экранах и дисплеях с высоким разрешением.Читать полностью »

в 13:53, , рубрики: html, html5, javascript, windows, Windows 8, метапрограммирование, метки: , , ,

Интерактивная книга «Радугоны» на HTML5 и JavaScript для Windows 8 (неделя в Store)Уважаемый хаброчитатель, поведаем тебе сегодня об опыте практической разработки приложений для Windows 8, подготовке, отладке и публикации проектов под этой платформой, и про применение одного из методов метопрограммирования (о чем мы писали раньше) для анимации в стеке технологий HTML5 + JavaScript + Metro style apps. Ведь теперь в Windows 8 можно применять JavaScript не только в браузере, но и для создания нативных «оконных» приложений. И вот, мы уже 6 дней в сторе, приложение можно установить бесплатно, более того, мы не приводим тут код, т.к. его можно свободно посмотреть после установки приложения прямо по папочкам js, css, html, fonts, images. Можно качать и смотреть, обфускацию мы не применяли. Пока HTML5 приложения ни как не защищены в маркете, но Microsoft обещает в самое ближайшее время реализовать защиту.
Читать полностью »

в 13:21, , рубрики: amd, appcache, html5, javascript, метки: , , ,

Загрузка и инициализация JavaScript
С появлением мобильного веба наш интернет стал снова плохим, а устройства медленными. 3G, 4G, Wi-Fi… — они, конечно, где-то есть, но когда очень надо, то как правило скорость падает до околомодемной и получается, что наши мобильный устройства «каменного века» попадают в условия современного объема информации. Даже в центре города (правда на 15-м этаже) значек мобильного интернета может показывать волшебную букву Е, намекающую о том, что уж лучше не тратить нервы и потерпеть. Лучше уж использовать нативную версию какого-то веб-сервиса, чем каждый раз ждать, загружать по мегабайту, чтобы отправить короткое сообщение. Нативную версию веб-сервиса... Понятное дело маркетинг, гонка приложений. Однако, же пользователи выбирают нативные веб-приложения, которые работают быстрее, не качают кучу ресурсов, хотя им приходится периодически его обновлять.

Эта статья о том какими путями можно оптимизировать загрузку и инициализацию JavaScript.
Читать полностью »

в 10:46, , рубрики: canvas, html5, javascript, WebGL, Веб-разработка

WebGL-2d — весьма интересная javascript библиотека, реализующая стандартные методы для работы с 2d контекстом Canvas на WebGL контексте.

Ни для кого не секрет, что сегодня Canvas не может похвастаться хорошей производительностью и отрисовка сложных сцен в реальном времени может стать проблемой. С WebGL ситуация с производительностью существенно лучше, но этот стандарт поддерживают не все популярные браузеры, в частности Microsoft даже не планирует внедрять его поддержку в IE (сторонние разработчики по этой причине уже начали делать плагин).

Подключив WebGL-2d и добавив всего пару строчек, мы можем существенно ускорить отрисовку графики, реализованную с средствами Canvas 2d API в браузерах, поддерживающих WebGL и обеспечить fallback к обычному 2d контексту.

Читать полностью »

в 10:31, , рубрики: html5, javascript, nokia, Веб-разработка, карты, мобильные приложения, мобильные устройства, Мобильный веб, метки: , , , ,

На днях команда HTML5-карт Nokia представила API карт под смартфоны и планшетники.

С места — в карьер!

Попробовать можно по ссылке: bit.ly/html5map
На данный момент поддерживаются Webkit-браузеры.

Достоинства и возможности

  • Компоненты
    Карты, пробки, поиск, геолокация, информация об интересных местах, навигация, пешеходные маршруты, избранное.
  • Вес
    80 KB Javascript + 10 KB CSS
  • Производительность
    Быстрая загрузка и плавные эффекты.
  • Готовность
    Можно легко поменять цвета, обернуть в PhoneGap или QtWebkit и получить готовое приложение.
  • WYSIWYG-помощник
    Помогает настроить конфигурацию под себя.

HTML5 карты для мобильных платформЧитать полностью »

в 8:19, , рубрики: css3, html, html5, jquery, блог, веб-дизайн, Веб-разработка, метки: , , , ,

Солнце, лето, море, пляж — распиарю свой вояж
В свободное время я пишу ленточный движок для веб-сайтов, используя модные современные технологии. Эта статья — продолжение заметок (Tips & Tricks) про его создание.
Часть 1 находится здесь.

Как же дела у каретки за прошедший с момента публикации месяц? Новости читаю, дела идут, 200 источников, 150 тысяч записей в месяц, данные для анализа собираются. Трафик устойчиво низкий, по 80-100 человек в сутки (дубликат контента).

Мегапопулярные Фейсбук, ВК, Твиттер, Пинтерест — всё это так называемые «ленты». Лента — весьма удобный для человека способ предоставления информации, если её можно как-либо упорядочить. История циклична, всё повторяется — именно таким способом и выводили результаты расчётов первые компьютеры, только на рулоны бумаги, а не на мониторы 1920*1080*32.

Вычитал я в новостях, что туристический сезон начинается. «А ведь я тоже кое-где был — можно и поделиться» — пришла мысль, и сегодня мы будем затачивать ленту под развлекательный мини-бложек. Турлента — с гейшами и путешествиями под катом.
Читать полностью »

1...1020...697071...76
Главная   |  Архив новостей  |   Android  |   Google  |   Apple  |   Microsoft  |   Информационная безопасность  |   Веб – разработка
Публикации RSS  |  Комментарии RSS
https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js