편집 요약 없음 태그: 되돌려진 기여 |
편집 요약 없음 태그: 되돌려진 기여 |
||
| 14번째 줄: | 14번째 줄: | ||
@keyframes ZCA-mainimg { | @keyframes ZCA-mainimg { | ||
from {opacity: 0; transform: translateY(-20%);} | from {opacity: 0; transform: translateY(-20%);} | ||
to {opacity: 0. | to {opacity: 0.5; transform: translateY(0%);} | ||
} | } | ||
2023년 9월 30일 (토) 10:31 판
/* # 등장 애니메이션 */
.ZCA-mainimg {
opacity: 0;
animation: ZCA-maintext;
animation-iteration-count: 1;
animation-duration: 1s;
animation-delay: 0s;
animation-fill-mode: forwards;
transition: .2s ease;
transform: translateY(0%);
}
@keyframes ZCA-mainimg {
from {opacity: 0; transform: translateY(-20%);}
to {opacity: 0.5; transform: translateY(0%);}
}
.ZCA-maintext {
opacity: 0;
animation: ZCA-maintext;
animation-iteration-count: 1;
animation-duration: 1s;
animation-delay: 0.75s;
animation-fill-mode: forwards;
}
@keyframes ZCA-maintext {
from {opacity: 0;}
to {opacity: 1;}
}
.ZCA-subtext1 {
opacity: 0;
animation: ZCA-subtext;
animation-iteration-count: 1;
animation-duration: 1s;
animation-delay: 0s;
animation-fill-mode: forwards;
transition: .2s ease;
transform: translateX(0%);
}
.ZCA-subtext2 {
opacity: 0;
animation: ZCA-subtext;
animation-iteration-count: 1;
animation-duration: 1s;
animation-delay: 0.25s;
animation-fill-mode: forwards;
transition: .2s ease;
transform: translateX(0%);
}
.ZCA-subtext3 {
opacity: 0;
animation: ZCA-subtext;
animation-iteration-count: 1;
animation-duration: 1s;
animation-delay: 0.5s;
animation-fill-mode: forwards;
transition: .2s ease;
transform: translateX(0%);
}
@keyframes ZCA-subtext {
from {opacity: 0; transform: translateX(-2%);}
to {opacity: 1; transform: translateX(0%);}
}