Шапка сайта

HTML5

Урок 6 Формы Исходник Упражнения
Урок 7 Drag and Drop Исходник Упражнения
Урок 9 Canvas Исходник Упражнения

Упражнение

X
  1. Сделайте простую вёрстку с использованием всех следующих тегов: header, nav, article, section, aside, figure, figcaption, mark, footer.
  1. Вставьте аудио на страницу с автозапуском.
  2. Для тех, кто знает JavaScript:
    1. Найдите 3 мелодии.
    2. Выведите названия этих мелодий через тег ul.
    3. При клике на название необходимо начать её воспроизведение в плеере.
  1. Вставьте видео на страницу без автозапуска.
  2. Для тех, кто знает JavaScript:
    1. Найдите 3 видеофайла.
    2. Выведите названия этих видеофайлов через тег ul.
    3. При клике на название необходимо начать его воспроизведение в плеере.
  1. Сделайте форму для регистрации со следующими полями: имя, email, телефон, дата рождения, пароль, - а также с кнопкой «Регистрация».
  2. Добавьте максимум проверок и удобных элементов для пользователей без использования JavaScript.
  1. Выведите 3 картинки с изображениями различных товаров.
  2. Добавьте атрибут data-price со значением цены в каждый тег img.
  3. Сделайте блок, отвечающий за корзину.
  4. При перетаскивании товара в блок корзины добавляйте изображение товара в корзину, плюс выводите итоговую сумму внутри этого блока, добавляя значение атрибута data-price у перетаскиваемого товара.
  1. Вставьте Яндекс.Карты на страницу.
  2. Поставьте балун на то место карты, где находится посетитель Вашего сайта.

Примечание: здесь про балуны.
Основная документация по API Яндекс.Карт: http://api.yandex.ru

  1. Добавьте элемент Canvas и выделите его цветом фона.
  2. При первом клике по Canvas сохраните координаты в глобальную переменную.
  3. При втором клике по Canvas проведите линию из точки первого клика в точку второго клика.
  4. При третьем клике по Canvas проведите линию из точки второго клика в точку третьего клика.
  5. И так далее.