左右搖頭
快速小幅左右擺動，用於「不正確」的回饋。
效果預覽
參數調節
完整代碼
/* 左右搖頭 */
@keyframes headShake {
0%, 100% { transform: translateX(0); }
15% { transform: translateX(-8px) rotate(-3deg); }
30% { transform: translateX(7px) rotate(3deg); }
45% { transform: translateX(-6px) rotate(-2deg); }
60% { transform: translateX(5px) rotate(2deg); }
80% { transform: translateX(-2px) rotate(-1deg); }
}
.head-shake { animation: headShake .7s ease-in-out both; }