Posts Tagged ‘веб-страницы’

Тег CANVAS: рисование на веб-странице (ч.1)

Воскресенье, Май 6th, 2012 Нет комментариев

Under : , , , , , ,

Продолжаем знакомство с возможностями новой версии языка HTML под номером 5, поддерживаемой Internet Explorer  9 и другими современными веб-браузерами. На этот раз мы поговорим о новых графических возможностях HTML 5. Они включают тег <CANVAS> и средства для программного рисования прямо на веб-странице. Мы, как веб-дизайнеры, давно об этом мечтали…

1. Прошлое и настоящее веб-графики
Начнём с того, что совершим небольшой экскурс в историю веб-графики, рассмотрим, что нам предлагала предыдущая версия HTML — 4.01, и выясним, что стоит ждать от HTML 5.
(далее…)

Тег CANVAS: рисование на веб-странице (ч.2)

Воскресенье, Май 6th, 2012 Нет комментариев

Under : , , , , ,

Продолжаем рассматривать канву HTML 5 — средство для программного рисования прямо на веб-странице.

8. Рисование сложных фигур
Но чтобы нарисовать более-менее сложную картинку, одних только прямоугольников недостаточно. Поэтому канва предоставляет нам средства для рисования сложных фигур, контур которых состоит из произвольного количества сегментов — прямых и кривых линий, соединённых друг с другом. Сейчас мы узнаем, как пользоваться этими средствами. (далее…)

Тег CANVAS: рисование на веб-странице (ч.3)

Воскресенье, Май 6th, 2012 Нет комментариев

Under : , , , , , ,

В третьей части статьи о канве HTML 5 мы расскажем о том, как осуществлять заливку канвы сплошным и градиентным цветами.

9. Задание цвета линий контура и заливок
Было бы странно, если бы канва не предоставляла средств для указания цвета линий и заливок. Разумеется, она позволяет это сделать! Причём поддерживаются как сплошные, так и градиентные цвета. А ещё мы можем использовать в качестве цвета любое графическое изображение!
(далее…)

Тег CANVAS: рисование на веб-странице (ч.4)

Воскресенье, Май 6th, 2012 Нет комментариев

Under : , , , ,

10. Задание толщины и других параметров линий контура
По умолчанию все контуры рисуются линиями толщиной в 1 пиксел. Однако мы можем указать для них другую толщину, а также задать другие их параметры.

Для задания толщины линий контуров используется свойство lineWidth объекта CanvasRenderingContext2D. Значение толщины должно быть указано в виде числа в пикселах.
(далее…)

Тег CANVAS: рисование на веб-странице (ч.5)

Воскресенье, Май 6th, 2012 Нет комментариев

Under : , , , , ,

14. Преобразования системы координат
Преобразования - это различные действия, которые мы можем выполнять над системой координат канвы. В число таких преобразований входят смещение точки начала координат, изменение масштаба системы координат и её поворот. Это может пригодиться, если мы собираемся создать фигуру, которую иными средствами нарисовать невозможно или очень сложно.

Отметим, что преобразования затрагивают только систему координат канвы. Уже присутствующая на ней графика останется неизменной. Однако графика, которую мы нарисуем после этого, будет выводиться уже в изменённой системе координат. (далее…)

Тег CANVAS: рисование на веб-странице (ч.6)

Воскресенье, Май 6th, 2012 Нет комментариев

Under : , , , ,

18. Создаём анимацию на канве
К сожалению, канва HTML 5 не предоставляет никаких специальных средств для создания анимации. Нам придётся пользоваться для этого стандартные средства веб-браузера, а именно, метод setInterval объекта Window.

Объект Window представляет окно веб-браузера. Экземпляр этого объекта, представляющий текущее окно веб-браузера, доступен через переменную window, доступную в любом веб-сценарии.

Метод setInterval создаёт таймер, который можно рассматривать как своего рода «будильник», который срабатывает каждый раз, когда пройдет определённый интервал времени. Срабатывание этого «будильника» заключается в вызове указанной нами функции.

Вот формат вызова этого метода: (далее…)

Хранилище DOM: удобное хранение данных (ч.1)

Воскресенье, Май 6th, 2012 Нет комментариев

Under : , , , ,

Предлагаем вашему вниманию очередную статью из цикла, посвящённого возможностям HTML 5 — новой версии языка разметки веб-страниц HTML. В преддверии скорого выхода очередной версии Internet Explorer  эта тема становится всё актуальнее.

На этот раз мы рассмотрим средства HTML 5 для удобного хранения данных на клиентском компьютере. А именно, хранилище DOM (DOM Storage).

1. Средства хранения данных на клиентском компьютере: введение в суть вопроса (далее…)

Хранилище DOM: удобное хранение данных (ч.2)

Воскресенье, Май 6th, 2012 Нет комментариев

Under : , , , ,

3.2. Локальное хранилище DOM
Локальное хранилище DOM доступно для веб-страниц, загруженных с одного домена и его поддоменов и открытых в разных окнах или вкладках веб-браузера. То есть мы можем загрузить несколько веб-страниц с одного и того же домена и открыть их в разных окнах или вкладках — и все они будут иметь доступ к данным, помещённым в локальное хранилище.

Данные в локальном хранилище хранятся постоянно, даже при закрытом веб-браузере. Этим локальное хранилище отличается от сессионного (см. параграф 3.1).
(далее…)

Geolocation API в Internet Explorer 9

Воскресенье, Май 6th, 2012 Нет комментариев

Under : , , , ,

Новая версия языка разметки веб-страниц HTML 5 имеет поистине неисчерпаемые возможности. Так, помимо всего прочего, она предоставляет средства для определения местоположения — так называемый Geolocation API. То есть мы можем в своих веб-сценариях определить точное местоположение — широту и долготу — компьютера клиента. Разумеется, для этого компьютер должен иметь соответствующие сенсоры, например, GPS.

Именно о Geolocation API и пойдёт речь в данной статье.

(далее…)

Закреплённые сайты: создание и управление из сценариев (ч.4)

Воскресенье, Май 6th, 2012 Нет комментариев

Under : , , , , ,

Последняя, заключительная, часть статьи о возможностях по программному управлению закреплёнными веб-сайтами в Internet Explorer 9.

7. Способы привлечь внимание пользователя
Internet Explorer 9 предоставляет два способа привлечь внимание пользователя к закреплённым веб-сайтам. Сейчас мы их рассмотрим.

Примечание:
Перед использованием возможностей по привлечению внимания пользователя обязательно следует проверить, был ли веб-сайт закреплён. Для этого можно использовать уже знакомый нам метод msIsSiteMode. (далее…)