Enhance cat animation: adjust size, spawn logic, and animation duration for improved visual effect
This commit is contained in:
@@ -13,23 +13,22 @@
|
||||
|
||||
.friday13-cat {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
width: 150px; /* MARK: Cat size */
|
||||
height: auto;
|
||||
user-select: none;
|
||||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
@keyframes cat-walk-right {
|
||||
0% { left: -10vw; transform: scaleX(1); opacity: 1; }
|
||||
99% { left: 110vw; transform: scaleX(1); opacity: 1; }
|
||||
100% { opacity: 0; }
|
||||
0% { left: -10vw; transform: scaleX(-1); opacity: 1; }
|
||||
99% { left: 110vw; transform: scaleX(-1); opacity: 1; }
|
||||
100% { opacity: 0; transform: scaleX(-1); left: 110vw; }
|
||||
}
|
||||
|
||||
@keyframes cat-walk-left {
|
||||
0% { left: 110vw; transform: scaleX(-1); opacity: 1; }
|
||||
99% { left: -10vw; transform: scaleX(-1); opacity: 1; }
|
||||
100% { opacity: 0; }
|
||||
0% { left: 110vw; transform: scaleX(1); opacity: 1; }
|
||||
99% { left: -10vw; transform: scaleX(1); opacity: 1; }
|
||||
100% { opacity: 0; transform: scaleX(1); left: -10vw; }
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user