Шаблон:Бегущая строка/styles.css: различия между версиями

Версия от 16:20, 3 сентября 2026

.running-line {
    position: relative;
    width: 100%;
    height: 32px;
    overflow: hidden;
    white-space: nowrap;
}

.running-line__item {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 100%;

    animation-name: running-line-scroll;
    animation-duration: 15s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

/* Следующий текст появляется после окончания предыдущего */
.running-line__item:nth-child(1) {
    animation-delay: 0s;
}

.running-line__item:nth-child(2) {
    animation-delay: 15s;
}

.running-line__item:nth-child(3) {
    animation-delay: 30s;
}

.running-line__item:nth-child(4) {
    animation-delay: 45s;
}

.running-line__item:nth-child(5) {
    animation-delay: 60s;
}

@keyframes running-line-scroll {
    0% {
        left: 100%;
    }

    100% {
        left: -100%;
    }
}