左右摇头
快速小幅左右摆动,用于「不正确」的反馈。
效果预览
参数调节
完整代码
/* 左右摇头 */
@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; }