「テンプレート:出ずる/style.css」の版間の差分

提供:WikiWiki
ナビゲーションに移動 検索に移動
編集の要約なし
編集の要約なし
 
(同じ利用者による、間の6版が非表示)
30行目: 30行目:
   100% {transform: translateX(-25vw);}
   100% {transform: translateX(-25vw);}
}
}
.hovot{animation-play-state: paused}
.hovrl1:active{animation-play-state: paused}
.hovrl1:active{animation-play-state: paused}
.hovrl2:active{animation-play-state: paused}
.hovrl2:active{animation-play-state: paused}
.hovrl3:active{animation-play-state: paused}
.hovrl3:active{animation-play-state: paused}
.hovot:hover{animation: hovot .5s ease-in}
.hovoright{animation-play-state: paused}
@keyframes hovot {
.hovoright:hover{animation: hovoright .5s ease-in;animation-fill-mode: forwards;}
@keyframes hovoright {
   0% {transform: translateX(0vw);}
   0% {transform: translateX(0vw);}
   100% {transform: translateX(100vw);}
   100% {transform: translateX(100vw);}
}
}
.hovoleft{animation-play-state: paused}
.hovoleft:hover{animation: hovoleft .5s ease-in;animation-fill-mode: forwards;}
@keyframes hovoleft {
  0% {transform: translateX(0vw);}
  100% {transform: translateX(-100vw);}
}
.hovodown{animation-play-state: paused}
.hovodown:hover{animation: hovodown .5s ease-in;animation-fill-mode: forwards;}
@keyframes hovodown {
  0% {transform: translateY(0vw);}
  100% {transform: translateY(100vh);}
}
.hovatch{color:white;background-color:white}
.hovatch:hover{color:#aa0000;background-color:black}
.hovred{color:#ff8c00;background-color:#ff8c00}
.hovred:hover{color:#aa0000;background-color:black}

2年5月29日 (I) 00:21時点における最新版

.hov {
  color: white;
}
.hovobe {
  color: black;
}
.hov:hover {
  color: black;
}
.hovobe:hover {
  animation: hbound .3s ease infinite alternate;
}
@keyframes hbound {
  0% {transform: translateY(25px);color:red}
  100% {transform: translateY(-25px);color:blue}
}
.hovrl1{animation: hrl1 .7s linear infinite alternate;}
@keyframes hrl1 {
  0% {transform: translateX(25vw);}
  100% {transform: translateX(-25vw);}
}
.hovrl2{animation: hrl2 .5s linear infinite alternate;}
@keyframes hrl2 {
  0% {transform: translateX(25vw);}
  100% {transform: translateX(-25vw);}
}
.hovrl3{animation: hrl3 .1s linear infinite alternate;}
@keyframes hrl3 {
  0% {transform: translateX(25vw);}
  100% {transform: translateX(-25vw);}
}
.hovrl1:active{animation-play-state: paused}
.hovrl2:active{animation-play-state: paused}
.hovrl3:active{animation-play-state: paused}
.hovoright{animation-play-state: paused}
.hovoright:hover{animation: hovoright .5s ease-in;animation-fill-mode: forwards;}
@keyframes hovoright {
  0% {transform: translateX(0vw);}
  100% {transform: translateX(100vw);}
}
.hovoleft{animation-play-state: paused}
.hovoleft:hover{animation: hovoleft .5s ease-in;animation-fill-mode: forwards;}
@keyframes hovoleft {
  0% {transform: translateX(0vw);}
  100% {transform: translateX(-100vw);}
}
.hovodown{animation-play-state: paused}
.hovodown:hover{animation: hovodown .5s ease-in;animation-fill-mode: forwards;}
@keyframes hovodown {
  0% {transform: translateY(0vw);}
  100% {transform: translateY(100vh);}
}
.hovatch{color:white;background-color:white}
.hovatch:hover{color:#aa0000;background-color:black}
.hovred{color:#ff8c00;background-color:#ff8c00}
.hovred:hover{color:#aa0000;background-color:black}