dumorando.github.io/snail.css at main · thepython555/dumorando.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
#sillysnail {
    display: block;
    position: relative;
    margin-top: -4px;
    animation-name: bouncing;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-delay: 0s;
}

@keyframes bouncing {
  0% {
      left: 0;
      top: 0;
      transform: rotate(0deg);
      animation-timing-function: ease-out;
  }
  25% {
      left: 10px;
      top: -50px;
      transform: rotate(10deg);
      animation-timing-function: ease-in;
  }
  50% {
      left: 0;
      top: 0;
      transform: rotate(0deg);
      animation-timing-function: ease-out;
  }
  75% {
      left: -10px;
      top: -50px;
      transform: rotate(-10deg);
      animation-timing-function: ease-in;
  }
  100% {
      left: 0;
      top: 0;
      transform: rotate(0deg);
  }
}