Деякі довідники html пишуть, що Тег <marquee> вважається застарілим, і W3D не рекомендує його використовувати. Начебто, під час використання цього тегу можуть виникнути проблеми з валідністю коду. Однак, під час роботи з SaaS-сервісами BLOGGER та JIMDO такого поки що не спостерігалося. У сервісі BLOGGER його навіть можна використовувати у заголовках сторінок, що дає цікавий візуальний ефект. У JIMDO це працює тільки як html-віджет.
Розмітка виглядає таким чином <marquee>текст рядка, що біжить</marquee>
За замовчуванням текст рухається справа наліво, потім ховається за межами області, після чого знову починає рух справа наліво.
У тега <marquee> може бути багато атрибутів, які задають напрям, тип та швидкість руху. Можна задавати колір фону, на якому рухається текст та параметри самого тексту.
Пересувати по екрану можна як текст, так і зображення. Для цього достатньо замість тексту вказати адресу зображення (ви можете розмістити його на службовій сторінці)
<marquee>текст рядка, що біжить</marquee>
Текст рухається справа наліво, потім ховається за межами області, після чого починає рух спочатку.
У тега <marquee> може бути кілька атрибутів (тут наводяться лише основні, решту можна знайти у довідниках по html)
direction - задає напрям руху.
bgcolor - задає колір фону, на якому рухається текст (за замовчуванням, це фоновий колір сторінки, але можна поставити будь-який колір).
behavior - задає тип руху. У цього атрибута можуть бути такі значення:
- scroll - контент переміщується у напрямку, що задається атрибутом direction, потім ховається за межами області, після чого починає рух спочатку.
- slide - контент переміщується у напрямку, що задається атрибутом direction, доходить до краю області і зупиняється.
- alternate - контент міняє напрямок, коли доходить до краю.
ПРИКЛАДИ
Текст переміщується не справа наліво, а зліва направо
<marquee direction="right"> текст рядка, що біжить </marquee>
Текст переміщується між правим та лівим краєм сторінки
<marquee behavior="alternate" direction="left"> текст рядка, що біжить </marquee>
Текст переміщується справа наліво та зупиняється у лівого краю.
<marquee behavior="slide"> текст рядка, що біжить </marquee>
Текст переміщується на жовтому фоні
<marquee bgcolor="yellow"> текст рядка, що біжить</marquee>
Великий червоний текст переміщується між правим та лівим краєм сторінки
<marquee behavior="alternate"><i><b><span style="color: red;"><span style="font-size: 18pt;"> текст рядка, що біжить </span></span></b></i></marquee>
Насправді елемент <marquee> відображається як прямокутник, ширина і висота якого встановлюються. Якщо цих значень не вказувати, то за замовчуванням ширина і висота цього прямокутника будуть дорівнювати ширині шаблону і висоті текстового рядка відповідно.
За бажанням розміри цього прямокутника можна задати за допомогою атрибутів width и height. Тоді прокрутка тексту буде відбуватися в межах заданих розмірів. Якщо прямокутник великий, то прокрутку можна запустити не тільки горизонтально, але й вертикально.
Допускається використовувати значення ширини в пікселях або відсотках. Якщо встановлений відсотковий запис, то розміри обчислюються відносно шаблону сайту. Іншими словами, width="100%" означає, що елемент буде займати всю доступну ширину веб-сторінки.
Приклад: Організувати прокрутку тексту білого кольору знизу вгору в прямокутнику оливкового кольору розміром 150х180 пікселів.
Код буде виглядати так:
<marquee bgcolor="olive" direction="up" height="150" style="color: white; text-align: center;" width="80%">Текст рядка, що біжить </marquee>
У прокрутку можна пустити не тільки один рядок, а й довгий текст. Якщо є бажання розмістити блок із текстом по центру сторінки, то перед тегом прокручування можна поставити тег центрування цього блоку <div style="text-align: center;">
Тоді це буде виглядати так.
Текст переміщується не справа наліво, а зліва направо
<marquee direction="right"> текст рядка, що біжить </marquee>
Текст переміщується між правим та лівим краєм сторінки
<marquee behavior="alternate" direction="left"> текст рядка, що біжить </marquee>
Текст переміщується справа наліво та зупиняється у лівого краю.
<marquee behavior="slide"> текст рядка, що біжить </marquee>
Текст переміщується на жовтому фоні
<marquee bgcolor="yellow"> текст рядка, що біжить</marquee>
Великий червоний текст переміщується між правим та лівим краєм сторінки
<marquee behavior="alternate"><i><b><span style="color: red;"><span style="font-size: 18pt;"> текст рядка, що біжить </span></span></b></i></marquee>
Насправді елемент <marquee> відображається як прямокутник, ширина і висота якого встановлюються. Якщо цих значень не вказувати, то за замовчуванням ширина і висота цього прямокутника будуть дорівнювати ширині шаблону і висоті текстового рядка відповідно.
За бажанням розміри цього прямокутника можна задати за допомогою атрибутів width и height. Тоді прокрутка тексту буде відбуватися в межах заданих розмірів. Якщо прямокутник великий, то прокрутку можна запустити не тільки горизонтально, але й вертикально.
Допускається використовувати значення ширини в пікселях або відсотках. Якщо встановлений відсотковий запис, то розміри обчислюються відносно шаблону сайту. Іншими словами, width="100%" означає, що елемент буде займати всю доступну ширину веб-сторінки.
Приклад: Організувати прокрутку тексту білого кольору знизу вгору в прямокутнику оливкового кольору розміром 150х180 пікселів.
Код буде виглядати так:
<marquee bgcolor="olive" direction="up" height="150" style="color: white; text-align: center;" width="80%">Текст рядка, що біжить </marquee>
У прокрутку можна пустити не тільки один рядок, а й довгий текст. Якщо є бажання розмістити блок із текстом по центру сторінки, то перед тегом прокручування можна поставити тег центрування цього блоку <div style="text-align: center;">
Тоді це буде виглядати так.
Пересувати по екрану можна як текст, так і зображення. Для цього достатньо замість тексту вказати адресу зображення (ви можете розмістити його на службовій сторінці)
Код при цьому може виглядати так:
<marquee direction="left" scrollamount="20"><img src="https://адреса зображення" /></marquee>