Шаблон:Бегущая строка/styles.css: различия между версиями
Aeonorien (обсуждение | вклад) Нет описания правки |
Aeonorien (обсуждение | вклад) Нет описания правки |
||
| Строка 3: | Строка 3: | ||
white-space: nowrap; | white-space: nowrap; | ||
width: 100%; | width: 100%; | ||
height: | height: 2em; | ||
line-height: | line-height: 2em; | ||
position: relative; | position: relative; | ||
} | } | ||
| Строка 14: | Строка 14: | ||
white-space: nowrap; | white-space: nowrap; | ||
color: #eaeaea; | color: #eaeaea; | ||
opacity: 0; | opacity: 0; | ||
animation: scroll 12s linear infinite; | |||
} | } | ||
.marquee span:nth-child(1) { animation-delay: 0s; } | .marquee span:nth-child(1) { animation-delay: 0s; } | ||
.marquee span:nth-child(2) { animation-delay: | .marquee span:nth-child(2) { animation-delay: 12s; } | ||
.marquee span:nth-child(3) { animation-delay: | .marquee span:nth-child(3) { animation-delay: 24s; } | ||
.marquee span:nth-child(4) { animation-delay: | .marquee span:nth-child(4) { animation-delay: 36s; } | ||
.marquee span:nth-child(5) { animation-delay: | .marquee span:nth-child(5) { animation-delay: 48s; } | ||
@keyframes scroll { | @keyframes scroll { | ||
| Строка 29: | Строка 29: | ||
opacity: 1; | opacity: 1; | ||
} | } | ||
10% { | |||
transform: translateX(100%); | |||
opacity: 1; | |||
} | |||
80% { | |||
transform: translateX(-110%); | transform: translateX(-110%); | ||
opacity: 1; | opacity: 1; | ||
} | } | ||
85% { | |||
opacity: 0; | |||
} | |||
100% { | |||
transform: translateX(-110%); | transform: translateX(-110%); | ||
opacity: 0; | opacity: 0; | ||
} | } | ||
} | } | ||