Бегущая строка на чистом css -marquee
marquee как тег в HTML5 перестал поддерживатся! Поэтому нужно его делать на чистом css. Здесь пример бегущей строки.
Код HTML:
<div class="marquee"><span>Пример бегущей строки</span></div>CSS:
/* ==BLOCK- Бегущая строка == */
.marquee {display: block; width: 100%;white-space: nowrap;overflow: hidden;}
.marquee span {display: inline-block;padding-left: 100%;animation: scroll 25s infinite linear;transition: all .003s ease;}
@keyframes scroll {
0% {transform: translate(-30%, 0);}
50% {transform: translate(-60%, 0)}
100% {transform: translate(-30%, 0);}
}
- Можно менять режим движения самой анимацией (keyframes) - кому как нужно.
- Задать скорость движения бегущей строки (в коде 25s)
--
Пишите в комментариях кому какую сделать анимацию.
Бегущая строка - пример:
Пример бегущей строки