1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
/* 噗寶上下移動 */

/* 第2個: 秒數 / 時速, 可以用點數, 如 1.5s */
/* 第3個: TWEEN類型: 有5種, 可參考 https://www.w3schools.com/css/tryit.asp?filename=trycss3_animation_speed */

#dynamic_logo {
  animation: MoveUpDown 2s ease-in-out infinite;
}

@keyframes MoveUpDown {
  0%, 100% {
    bottom: 50px; /* 基本位置 */
  }
  50% {
    bottom: 100px; /* 移動多少 */
  }
}