激しい衝撃が走る
重大なエラー左右に3往復、最初は16%の幅で、だんだん小さく震えて止まる。
- 時間
- 0.6s
- くり返し
- しない
- 速さの変化
- linear
- 動かすもの
- 位置・回転 translate rotate
CSS を見る
@keyframes onoma-dokan {
0% { transform: translate(0%, 0%) rotate(0deg); }
14.29% { transform: translate(-16%, 0%) rotate(-5.6deg); }
28.57% { transform: translate(13.33%, 0%) rotate(4.67deg); }
42.86% { transform: translate(-10.67%, 0%) rotate(-3.73deg); }
57.14% { transform: translate(8%, 0%) rotate(2.8deg); }
71.43% { transform: translate(-5.33%, 0%) rotate(-1.87deg); }
85.71% { transform: translate(2.67%, 0%) rotate(0.93deg); }
100% { transform: translate(0%, 0%) rotate(0deg); }
}
.onoma-dokan {
animation: onoma-dokan 0.6s linear both;
}
/* 動きを減らす設定の人には、動かさない */
@media (prefers-reduced-motion: reduce) {
.onoma-dokan { animation: none; }
}