Тест на производительность отрисовки html5 canvas браузером
Тест на производительность отрисовки html5 canvas браузеромПара ссылок на тесты производительности canvas
box-shadow и border-radius в Android 3
box-shadow и border-radius в Android 3Стандартный браузер у планшетных компьютеров с ОС Android 3 некорректно обрабатывает внутреннюю тень (-webkit-box-shadow: inset ...
) в сочетании с закруглёнными углами (border-radius
), добавляя фон без скруглённых уголков.
Ориентация экрана в Android 3
Ориентация экрана в Android 3У планшетных компьютеров с установленной ОС Android 3.0 и выше (в частности речь идет о Samsung Galaxy Tab) свойство window.orientation
имеет значение 0 в нормальной альбомной ориентации, т.к. именно альбомная ориентация является для таких планшетов основной.
JavaScript событие поворота устройства iOS и Android
JavaScript событие поворота устройства iOS и AndroidПри повороте устройства браузер отсылает событие orientationchange
. Это актуально для обеих операционных систем. Но подписка на это событие может осуществляться по разному. При проверке на разных устройствах iPhone, iPad и Samsung GT (Android), выяснилось что в iOS срабатывает следующий вариант установки обработчика:
window.onorientationchange = handler;
А для Android подписка осуществляется иначе:
window.addEventListener( 'orientationchange', handler, false );
Примечание: В обоих примерах handler
- функция-обработчик
Текущую ориентацию экрана можно узнать проверкой свойства window.orientation
, принимающего одно из следующих значений:
- 0 — нормальная портретная ориентация
- -90 — альбомная при повороте по часовой стрелке
- 90 — альбомная при повороте против часовой стрелки
- 180 — перевёрнутая портретная ориентация (пока только для iPad)
Для iOS 4.2 и выше есть более широкие возможности по отслеживанию точных углов наклона устройства в трёхмерном пространстве, а также некоторые другие плюшки гироскопа и акселерометра. Если интересно: документация на сайте Apple по событиям DeviceOrientationEvent и DeviceMotionEvent, статья на Хабрахабр.
Автоматическое изменение размеров текста в iOS
Автоматическое изменение размеров текста в iOSSafari для устройств с iOS (iPhone, iPod touch и iPad) автоматически регулирует размеры текста, даже если вы отключили scale для страницы с помощью тега viewport
. Это может приводить к изменению размеров текста, например при повороте устройства. Для управления фичей служит css свойство -webkit-text-size-adjust
, которое может принимать значения none | auto | %value
. Соответственно, чтобы отключить регуляцию размеров текста браузером, достаточно задать свойству значение none
:
-webkit-text-size-adjust:none;
Подсветка активных ссылок и кнопок на Android
Подсветка активных ссылок и кнопок на AndroidБраузер Android выделяет кнопки, ссылки и другие интерактивные элементы при касании оранжевым прямоугольником. Часто возникает задача стилизовать или убрать эту подсветку. Свойство outline
здесь не работает, необходимо использовать свойство -webkit-tap-highlight-color
. Если надо убрать подсветку - можно использовать
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
HTML5 Canvas описание API
HTML5 Canvas описание APIНаткнулся в Интернете на хорошую картинку, описывающую все методы и свойства API CanvasRenderingContext2D для рисования на HTML5 Canvas.
Взято с http://blog.nihilogic.dk
Назначение иконки веб-страницы (веб-приложения) для Web Clip
Назначение иконки веб-страницы (веб-приложения) для Web ClipПост является вольным переводом текста из документации Apple Configuring Web Applications.
Примечание: Web Clip функционал доступен в iOS 1.1.3 и выше. Имя файла apple-touch-icon-precomposed.png
доступно в iOS 2.0 и выше. Поддержка нескольких иконок для разных разрешений устройств доступна в iOS 4.2 и выше.
Вы можете захотеть, чтобы у пользователя была возможность добавить ваше web приложение или web-страницу на домашний экран (Home screen). Такие ссылки, представленные иконками, называются Web Clip. Следуйте следующим простым шагам, чтобы указать иконку, отображающую ваше web-приложение или web-страницу в iOS.
Область просмотра (viewport) Safari для iPhone и iPod touch, а также iPad
Область просмотра (viewport) Safari для iPhone и iPod touch, а также iPadВ разделе Configuring the Viewport документации Apple приведены размеры элементов интерфейса мобильного браузера Safari для iPhone и iPod touch в портретной ориентации. Для альбомной ориентации размеры в явном виде не указаны, в то же время высота панели кнопок (button bar) отличается и равна 32 пикселям.
Flash2PHP, js библиотека (beta)
Flash2PHP, js библиотека (beta)Тот факт, что F2P не использует формат adobe, а оперирует данными в формате JSON с использованием стандартного сжатия, позволяет использовать его не только при взаимодействии flash-приложения с php сервером, но также и любого другого клиентского приложения. При этом сохраняется не только привычная логика, но также достигается универсальность серверной части - к одному серверу могут подключаться несколько клиентов, написанных на разных языках.
В частности, в ходе реализации проекта по созданию многопользовательской online-игры на htlm5+css3+js мною была реализована библиотека для взаимодействия с сервером на языка JavaScript.