Тег <marquee>
Описание
Тег <marquee> создает автоматически прокручивающуюся область с текстом или изображениями. Устарел и не рекомендуется к использованию в современных веб-стандартах.
Важно! Элемент исключен из HTML5 и работает только в некоторых браузерах. Для анимации используйте CSS или JavaScript.
Историческое использование (не рекомендуется):
<marquee
behavior="scroll"
direction="left"
scrollamount="5">
Это устаревший бегущий текст
</marquee>
<style>
.scrolling-text {
overflow: hidden;
white-space: nowrap;
}
.scrolling-text span {
display: inline-block;
animation: scrollText 10s linear infinite;
}
@keyframes scrollText {
0% { transform: translateX(100%); }
100% { transform: translateX(-100%); }
}
</style>
<div class="scrolling-text">
<span>Это современная реализация бегущей строки</span>
</div>
Проблемы <marquee>:
- Не соответствует современным веб-стандартам
- Плохо влияет на производительность
- Отсутствие контроля над анимацией
- Проблемы с доступностью
- Не работает во многих современных браузерах
Современные альтернативы:
| Технология | Пример использования |
|---|---|
| CSS-анимации | @keyframes + transform |
| JavaScript | requestAnimationFrame |
| Web Animation API | element.animate() |
| Библиотеки (GSAP) | Плавные сложные анимации |
Совет: Для создания эффектов прокрутки используйте CSS-свойства animation и transform, которые обеспечивают лучшую производительность и контроль.
Тег <marquee> не следует использовать в современных веб-проектах — вместо него применяйте CSS-анимации или JavaScript-решения.
Атрибуты
| behavior | Тип движения (scroll|slide|alternate) |
| bgcolor | Цвет фона |
| direction | Направление движения (left|right|up|down) |
| height | Высота области |
| hspace | Горизонтальные отступы |
| loop | Количество циклов (-1 для бесконечности) |
| scrollamount | Скорость прокрутки |
| scrolldelay | Задержка между движениями |
| truespeed | Игнорировать системные ограничения скорости |
| vspace | Вертикальные отступы |
| width | Ширина области |
| accesskey | Горячая клавиша |
| class | CSS-классы |
| id | Уникальный идентификатор |
| style | Инлайновые стили |
| title | Всплывающая подсказка |
Поддержка браузерами
 |
 |
 |
 |
 |
|---|---|---|---|---|
| 3.0 | 1.0 | 4.0 | 1.0 | 1.0 |