:ZC-animation2/styles.css

Ernst (토론 | 기여)님의 2023년 9월 30일 (토) 10:18 판 (새 문서: →‎# 등장 애니메이션: .ZCA-maintext { opacity: 0; animation: ZCA-maintext; animation-iteration-count: 1; animation-duration: 1s; animation-delay: 0.9s; animation-...)
(차이) ← 이전 판 | 최신판 (차이) | 다음 판 → (차이)
/*   # 등장 애니메이션   */

.ZCA-maintext  {
 opacity: 0;
 animation: ZCA-maintext;
 animation-iteration-count: 1;
 animation-duration: 1s;
 animation-delay: 0.9s;
 animation-fill-mode: forwards;
 transition: .2s ease;
 transform: translateY(0%);
}

@keyframes ZCA-maintext {
  from {opacity: 0; transform: translateY(-20%);}
  to {opacity: 1; transform: translateY(0%);}
}

.ZCA-subtext  {
 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%);}
}