Бегущая строка

Тема урока: Бегущая строка.

Цели урока:

Ø  Познакомить с понятием бегущей строки;

Ø  Познакомить с параметрами бегущей строки;

Ø  Научить использовать бегущую строку на Web-странице.

Тип урока: изучение нового материала.

Вид урока: лекция.

Форма организации учебно-познавательной деятельности учащихся: фронтальная, индивидуальная.

Методы обучения:

Ø  словесные: рассказ, объяснение;

Ø  наглядные: методы иллюстрации.

Конспект урока.

Теоретическая часть.

Слово "marquee" буквально означает "шатер", "палатка". В качестве компьютерного термина оно используется для обозначения некоторого выделенного фрагмента документа или изображения. В языке HTML этот тэг позволяет не просто выделить область web-страницы, но и заставить ее "бегать" по экрану.

Бегущие строки создаются с помощью контейнера:

<marquee>содержимое бегущей строки</marquee>

Параметры тэга бегущей строки:

Тэг <marquee>... </marquee> имеет множество атрибутов, задающих стиль строки и характер движения.
Некоторые атрибуты используются и в других тэгах, их названия говорят сами за себя. Это, например, атрибуты:
- width - ширина области;

  - height - высота области;

  - bgcolor - цвет фона.

Атрибут behavior (т.е. "поведение") отвечает за способ "пробега" строки:

  - scroll - бесконечная прокрутка,
- slide - надпись выезжает и останавливается,
- alternate - надпись двигается вправо и влево попеременно.

Атрибут direction (т.е. "направление") определяет направление движения строки:

  - right, left, up, down.

Атрибут loop:

  Атрибут loop ("цикл, петля") задает число пробегов строки. Если этот атрибут не указан или имеет значение "-1", то строка будет "бегать" бесконечно.

Атрибут scrolldelay:

  Атрибут scrolldelay (т.е. "запаздывание пробега") определяет время между прорисовками строки (в миллисекундах). По умолчанию этот атрибут имеет значение 85.

<marquee behavior="alternate" bgcolor="yellow" scrolldelay="145" width="50%">

< font size="5" color="red">

Текст бегущей строки.

</font></marquee>

Бегущей строкой может быть и иллюстрация, тогда html-код  Web-страницы будет выглядеть так:  <marquee> <img src="иллюстрация"> </marquee>

Практическое задание:

1.      Откройте файл Оригами.html из папки 8_Практика, который вы сохранили на прошлом уроке

2.      Отредактируйте html-код Web-страницы таким образом, чтобы заглавие «Технология изготовления елочной игрушки из бумаги» являлось бегущей строкой. 

3. Добавьте в полученную Web-страницу бегущую иллюстрацию, скачанную вами из интернета, подходящую по тематике.
4. Сохраните файл.