Шаблон:Бегущая строка/styles.css

Материал из Space Station 14 Вики
.wiki-ticker {
    position: relative;
    width: 100%;
    height: 32px;
    overflow: hidden;
    white-space: nowrap;
}

.wiki-ticker > span {
    position: absolute;
    top: 50%;
    left: 100%;
    transform: translateY(-50%);
    white-space: nowrap;
    opacity: 0;
    animation-name: wiki-ticker-animation;
    animation-duration: 60s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

/* Первый текст */
.wiki-ticker > span:nth-child(1) {
    animation-delay: 0s;
}

/* Второй текст */
.wiki-ticker > span:nth-child(2) {
    animation-delay: -12s;
}

/* Третий текст */
.wiki-ticker > span:nth-child(3) {
    animation-delay: -24s;
}

/* Четвёртый текст */
.wiki-ticker > span:nth-child(4) {
    animation-delay: -36s;
}

/* Пятый текст */
.wiki-ticker > span:nth-child(5) {
    animation-delay: -48s;
}

@keyframes wiki-ticker-animation {
    0% {
        left: 100%;
        transform: translateY(-50%);
        opacity: 1;
    }

    20% {
        left: 0;
        transform: translate(-100%, -50%);
        opacity: 1;
    }

    20.01% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}