편집 요약 없음 |
편집 요약 없음 |
||
| 119번째 줄: | 119번째 줄: | ||
to { | to { | ||
margin-left: | margin-left: 30px; | ||
} | } | ||
} | } | ||
2023년 5월 23일 (화) 13:19 판
/* 사용자 문서 메뉴 */
.losiacard {
display: inline-block;
overflow: hidden;
width: 190px;
height: 280px;
border-radius: 5px;
transform: scale(0.90);
transition: .2s ease-out;
}
.losiacard:hover{
transition: .2s ease-in;
transform: scale(0.995);
z-index:3;
margin-left: auto;
margin-right: auto;
}
.losiacard img {
display: inline-block;
overflow: hidden;
width: 190px;
height: 280px;
border-radius: 5px;
transform: scale(0.90);
transition: .2s ease-out;
}
/* 돌아가라 1 */
.rotate{
transition: transform 2s;
}
.rotate:active{
transform: rotate(70deg);
}
/* 앨범 겨울봄 */
.album {
animation-duration: 40s;
animation-name: slidein2;
animation-timing-function: linear;
animation-fill-mode: forwards;
animation-iteration-count: 4;
}
@keyframes slidein2 {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* 앨범재생 겨울봄 */
.albumcircle {
animation-duration: 242s;
animation-name: slidein;
animation-timing-function: linear;
animation-fill-mode: forwards;
}
@keyframes slidein {
from {
margin-left: 0px;
}
to {
margin-left: 780px;
}
}
/* 앨범 리와인드 */
.album2 {
animation-duration: 30s;
animation-name: slidein4;
animation-timing-function: linear;
animation-fill-mode: forwards;
animation-iteration-count: 9;
}
@keyframes slidein4 {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* 앨범재생 리와인드 */
.albumcircle2 {
animation-duration: 271s;
animation-name: slidein3;
animation-timing-function: linear;
animation-fill-mode: forwards;
}
@keyframes slidein3 {
from {
margin-left: 0px;
}
to {
margin-left: 780px;
}
}
/* 무언가 */
.walkingman {
animation-duration: 0s;
animation-name: walkingman;
animation-timing-function: linear;
animation-fill-mode: forwards;
animation-delay: 1s;
}
@keyframes walkingman {
from {
margin-left: 0px;
}
to {
margin-left: 30px;
}
}