편집토론문서 역사

틀:JOtax/styles.css: 두 판 사이의 차이

(Ernst (토론)의 518101판 편집을 되돌림)
태그: 편집 취소
편집 요약 없음
2번째 줄: 2번째 줄:
}
}
.DO-HO-item1 {
.DO-HO-item1 {
  overflow:hidden;
   display:block;
  width:100%;
  opacity:1;
   display:inherit;
}
}
.DO-HO-item2 {
.DO-HO-item2 {
  overflow:hidden;
  width:0px;
  opacity:0;
   display:none;
   display:none;
}
}
29번째 줄: 23번째 줄:


@keyframes DO-HO-tap1 {
@keyframes DO-HO-tap1 {
   from {width:0px;opacity:0;}
   from {display:none;}
  50% {width:100%;opacity:1;}
   to {display:block;}
   to {width:auto;opacity:1;display:inherit;}
}
}
@keyframes DO-HO-tap2 {
@keyframes DO-HO-tap2 {
   from {width:auto;opacity:1;}
   from {display:block;}
  50% {width:0%;opacity:1;}
   to {display:none;}
   to {width:0px;opacity:0;display:none;}
}
}


2024년 2월 4일 (일) 09:19 판

.DO-HO-box {
}
.DO-HO-item1 {
  display:block;
}
.DO-HO-item2 {
  display:none;
}
.DO-HO-box:hover > .DO-HO-item2 {
  animation: DO-HO-tap1;
  animation-iteration-count: 1;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}
.DO-HO-box:hover > .DO-HO-item1 {
  animation: DO-HO-tap2;
  animation-iteration-count: 1;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}

@keyframes DO-HO-tap1 {
  from {display:none;}
  to {display:block;}
}
@keyframes DO-HO-tap2 {
  from {display:block;}
  to {display:none;}
}

.JO-tax-trigger {
	cursor: help;
}
.JO-tax-content {
  overflow:hidden;
  height:0px;
  opacity:0;
}
.JO-tax-trigger:hover > .JO-tax-content {
  animation: JO-tax-tap;
  animation-iteration-count: 1;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}

@keyframes JO-tax-tap {
  from {height:0px;opacity:0;}
  50% {height:26px;opacity:1;}
  to {height:auto;opacity:1;}
}

.JO-tax-trigger1 {
	cursor: help;
}
.JO-tax-trigger1:hover > .JO-tax-content {
  animation: JO-tax-tap1;
  animation-iteration-count: 1;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}

@keyframes JO-tax-tap1 {
  from {height:0px;opacity:0;}
  50% {height:74px;opacity:1;}
  to {height:auto;opacity:1;}
}
.JO-tax-trigger2 {
	cursor: help;
}
.JO-tax-trigger2:hover > .JO-tax-content {
  animation: JO-tax-tap2;
  animation-iteration-count: 1;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}
@keyframes JO-tax-tap2 {
  from {height:0px;opacity:0;}
  50% {height:81px;opacity:1;}
  to {height:auto;opacity:1;}
}

.JO-tax-trigger3 {
	cursor: help;
}
.JO-tax-trigger3:hover > .JO-tax-content {
  animation: JO-tax-tap3;
  animation-iteration-count: 1;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
}
@keyframes JO-tax-tap3 {
  from {height:0px;opacity:0;}
  50% {height:53px;opacity:1;}
  to {height:auto;opacity:1;}
}