关于css的敲击抖动动画

1.给它加个样式

 margin-left:3px; //看起来没有用，但是动画可以用它来调位置

2.在你需要它动的事件里面给它加个动画class，比如click,mouseover什么的

document.getElementsByClassName(el)[0].classList.add('shacking')

 setTimeout(()=>{

        document.getElementsByClassName(el)[0].classList.remove('shacking')

},600)      

3.给shacking加个动画

 .shacking{

   /* 添加显示时的抖动效果 */

    animation: shake 0.6s ease-in-out;

 }

 /* 定义抖动动画的关键帧 */

/*左3到左0，不就是右敲击吗嗷嗷嗷*/

 @keyframes shake {

    0% { margin-left: 3px; }

    25%{  margin-left: 0px; }

    50% {  margin-left: 3px; }

    75% {  margin-left: 0px; }

    100% {  margin-left: 3px; }

}