User:JacobsDevelop/common.css: Difference between revisions
Jump to navigation
Jump to search
(Created page with ".testelem { background-color: pink; }") |
No edit summary |
||
Line 1: | Line 1: | ||
. | .slider .slide { | ||
animation: slideshow 12.5s infinite; | |||
} | |||
.slider .slide:nth-child(1) { | |||
animation-delay: 0s; | |||
} | |||
.slider .slide:nth-child(2) { | |||
animation-delay: -2.5s; | |||
} | |||
.slider .slide:nth-child(3) { | |||
animation-delay: -5s; | |||
} | |||
.slider .slide:nth-child(4) { | |||
animation-delay: -7.5s; | |||
} | |||
.slider .slide:nth-child(5) { | |||
animation-delay: -10s; | |||
} | |||
@keyframes slideshow { | |||
0%, 16%, 100% { | |||
opacity: 1; | |||
animation-timing-function: ease; | |||
z-index: 0; | |||
} | |||
20% { | |||
opacity: 0; | |||
animation-timing-function: step-end; | |||
z-index: 0; | |||
} | |||
96% { | |||
opacity: 1; | |||
animation-timing-function: step-end; | |||
z-index: -1; | |||
} | |||
} | } |
Revision as of 11:37, 7 December 2023
.slider .slide {
animation: slideshow 12.5s infinite;
}
.slider .slide:nth-child(1) {
animation-delay: 0s;
}
.slider .slide:nth-child(2) {
animation-delay: -2.5s;
}
.slider .slide:nth-child(3) {
animation-delay: -5s;
}
.slider .slide:nth-child(4) {
animation-delay: -7.5s;
}
.slider .slide:nth-child(5) {
animation-delay: -10s;
}
@keyframes slideshow {
0%, 16%, 100% {
opacity: 1;
animation-timing-function: ease;
z-index: 0;
}
20% {
opacity: 0;
animation-timing-function: step-end;
z-index: 0;
}
96% {
opacity: 1;
animation-timing-function: step-end;
z-index: -1;
}
}