|
|
| (не показаны 3 промежуточные версии этого же участника) |
| Строка 1: |
Строка 1: |
| .wiki-ticker { | | .marquee { |
| position: relative;
| | display: block; |
| width: 100%;
| | overflow: hidden; |
| height: 32px;
| | white-space: nowrap; |
| overflow: hidden;
| | width: 100%; |
| white-space: nowrap;
| | padding: 8px 0; |
| | box-sizing: border-box; |
| } | | } |
| | | .marquee-inner { |
| .wiki-ticker > span { | | display: inline-block; |
| position: absolute;
| | white-space: nowrap; |
| top: 50%;
| | padding-left: 100%; |
| left: 100%;
| | animation: marquee 22s linear infinite; |
| transform: translateY(-50%);
| | color: #eaeaea; |
| white-space: nowrap;
| |
| opacity: 0;
| |
| animation-name: wiki-ticker-animation;
| |
| animation-duration: 60s;
| |
| animation-timing-function: linear;
| |
| animation-iteration-count: infinite;
| |
| } | | } |
| | | @keyframes marquee { |
| /* Первый текст */
| | 0% { transform: translateX(0); } |
| .wiki-ticker > span:nth-child(1) {
| | 100% { transform: translateX(-100%); } |
| 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;
| |
| }
| |
| } | | } |