[показать]
[показать]

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


Тег marquee создает бегущую строку на странице и позволяет перемещать по ней любые элементы — изображения, текст и т.д.
Пример:<marquee>СОДЕРЖИМОЕ</marquee>

[показать] [показать] [показать] [показать] [показать]

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



Атрибуты:
behavior - Задает тип движения содержимого контейнера marquee

Пример:<marquee behavior="alternate или scroll или slide">СОДЕРЖИМОЕ</marquee>

Задаваемые значения этому атрибуту:


alternate - Контент перемещается между правым и левым краем элемента.
[показать]


scroll - Контент перемещается в направлении, заданным атрибутом direction, затем скрывается за пределами области, после чего начинает движение с начала.
[показать]


slide - Контент перемещается в направлении, заданным атрибутом direction, доходит до края области и останавливается.
[показать]

Значение по умолчанию scroll


bgcolor - Цвет фона. Устанавливает цвет фона под содержимым элемента marquee.


Пример:<marquee bgcolor="#3A74B8">СОДЕРЖИМОЕ</marquee>


[показать]




direction - Указывает направление движения содержимого контейнера marquee. Содержимое может перемещаться в четырех направлениях, не только влево и вправо, но также вверх и вниз.
Пример:<marquee direction="down или left или right или up">СОДЕРЖИМОЕ</marquee>


down - Движение сверху вниз.

[показать]

left - Движение справа налево.
[показать]


right - Движение в правую сторону.
[показать]


up - Движение вверх.

[показать]

Значение по умолчанию - left




height - высота области прокрутки и width - ширина области прокрутки.


Элемент marquee отображается как прямоугольник, ширина и высота которого устанавливаются, соответственно, с помощью атрибутов width и height. Прокрутка содержимого будет происходить в пределах заданных размеров.


Пример:<marquee width="ширина" height="высота">СОДЕРЖИМОЕ</marquee>


Значение по умолчанию: ширина — 100%, высота — 12 пикселов.




hspace - горизонтальные поля вокруг контента и vspace - вертикальные поля вокруг содержимого.


Атрибуты hspace и vspace предназначены для добавления пустого пространства вокруг содержимого.
hspace устанавливает поля слева и справа от элемента (по горизонтали), а vspace — сверху и снизу (по вертикали). Поля не увеличивают фоновую область под содержимым и служат для изменения расстояния между тегом marquee и другими элементами страницы.


Пример:<marquee hspace="Любое целое положительное число в пикселах для поля по горизонтали">СОДЕРЖИМОЕ</marquee>


<marquee vspace="Любое целое положительное число в пикселах для поля по вертикали">СОДЕРЖИМОЕ</marquee>


Значение по умолчанию -1




loop - Задает, сколько раз будет прокручиваться содержимое. После того, как заданное число раз отсчитано, содержимое остается в конечной точке.
Пример:<marquee loop="число повторений. Любое целое положительное число или -1 для бесконечного воспроизведения движения">СОДЕРЖИМОЕ</marquee>

[показать]
Значение по умолчанию -1



scrollamount - Скорость движения контента. Чем выше значение, тем быстрее перемещается содержимое контейнера. Если значение равно нулю, то движения не происходит.


Пример:<marquee scrollamount="Любое целое положительное число в пикселах">СОДЕРЖИМОЕ</marquee>

[показать]
Значение по умолчанию 6



scrolldelay - Величина задержки в миллисекундах между движениями. Чем ниже значение, тем выше скорость движения, и наоборот.


Пример:<marquee scrolldelay="Любое целое положительное число миллисекунд">СОДЕРЖИМОЕ</marquee>

[показать]
Значение по умолчанию 85



truespeed - Отменяет встроенный ограничитель скорости при низких значениях атрибута scrolldelay. Если содержимое тега marquee перемещается слишком быстро, то срабатывает встроенный ограничитель скорости, который насильно замедляет скролирование. Это сделано для того, чтобы сохранить читабельность текста. Если вы намерены обойти это ограничение, добавьте атрибут truespeed, он заставляет прокручиваться содержимое с заданной скоростью. Для атрибута scrolldelay ограничение скорости начинается со значения 60 миллисекунд и ниже.
Пример:<marquee truespeed="truespeed">СОДЕРЖИМОЕ</marquee>

[показать]
По умолчанию этот атрибут выключен.


А теперь попробую собрать все атрибуты в один html код

<marquee hspace="поле вокруг содержимого" height="высота области прокрутки" bgcolor="#ffff99" width="ширина области прокрутки" vspace="поле вокруг содержимого" style="text-align: center; color: magenta;" behavior="тип движения содержимого контейнера" direction="направление движения" loop="сколько раз будет прокручиваться содержимое, 1-это бесконечно" scrollamount="10 скорость движения" scrolldelay="100 задержка движения в миллисекундах" truespeed=""> СОДЕРЖИМОЕ</marquee>


подставлю значения атрибутов

<marquee hspace="5" height="500" bgcolor="#99BFE6" width="200" vspace="5" behavior="alternate" direction="up" loop="-1" scrollamount="12" scrolldelay="90"><img data-cke-saved-src="http://s005.radikal.ru/i212/1403/9a/bbda2bcdae1b.gif" src="http://s005.radikal.ru/i212/1403/9a/bbda2bcdae1b.gif" /></marquee>

и посмотрю, что получается



[показать]


Ок! Кажется так сложно в начале, а в итоге всё так просто.


Вместо картинок можно писать текст, оформив его атрибутами текста, как обычно.