Как сделать бегущую строку на сайте




Как сделать бегущую строку на сайте, тег — < marquee > , примеры бегущей строки.

Часто при написании своего сайта, или его управлением, возникает потребность установить на сайт бегущую строку. Такой элемент дизайна привлекает внимание посетителей на нужные разделы сайта, а также может выделить определенную информацию на передний план, что даст возможность первоочередного просмотра нужной темы. В бегущей строке можно показывать рекламные обьявления, изображения, смайлики, баннеры и т. д.

бегущая строка, тег marquee

Сама бегущая строка создается тегом < marquee > текст </marquee >, а точнее создаёт динамический эффект автоматического скроллинга. Тег MARQUEE — блочный контейнер, аналогичный тегам P DIV SPAN, в который помещается нужная информация для отображения. Все моменты рассматривать довольно долго и сложно для начала, но здесь ниже будут показаны основные моменты для управления бегущей строкой и показаны примеры, на которых можно тренироваться.

Стандартная запись бегущей строки такая —
< marquee > текст внутри блока, или изображение, или несколько изображений, или ссылки </marquee > ,
соответствует такой записи —
< marquee behavior=»scroll» direction=»left» loop=»-1″ scrollamount=»6″ scrolldelay=»0″ > наполнение … < /marquee >

Атрибуты тега MARQUEE.

direction=» « — атрибут устанавливающий направление скроллинга:

     Значения:
left — движение справа налево (по умолчанию)
right — движение слева направо

up — движение снизу верх
down — движение сверху вниз
behavior=» « — атрибут устанавливающий тип скроллинга:

     Значения:
scroll — скроллинг в одном из заданных направлений (по умолчанию)
slide — одноразовый скроллинг с остановом контента
alternate — возвратно-поступательный скроллинг


width=» « — устанавливает ширину блока для строки
height=» « — устанавливает высоту блока
hspace=» » — отступа в пикселях от вертикальных границ блока
vspace=» » — отступ в пикселях от горизонтальных границ блока


bgcolor=» » — атрибут устаналивающий параметр цвета фона скроллинга
style=» « — атрибут указывает стиль форматирования блока и контента
class=» « — атрибут внедрение стиля форматирования блока и контента


loop=» « — определяет количество циклов перемещения
«-1» или «infinite» — безконечное перемещение наполнения в блоке
«N» — целое число, задающее количество показов в блоке


bgcolor=» » — атрибут устаналивающий параметр цвета фона скроллинга

Атрибут     scrollAmount    — устанавливает скорость движения строки.


Примеры бегущей строки.

простая строка — по умолчанию

заданные размеры блока строки

меняем фон блока

движение слева направо

постоянное движение

снизу вверх

сверху вниз

меняем скорость на маленькую


медленное движение текста снизу вверх и наоборот



строка со ссылкой на сайт с примерами



бегущая строка с изображением

HTML — код примеров бегущей строки.

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