如何在颤动中创建悬停按钮

<button id="hoverButton">悬停按钮</button>

@keyframes shake {
  0% { transform: translateX(0); }
  25% { transform: translateX(-5px) rotate(-5deg); }
  50% { transform: translateX(5px) rotate(5deg); }
  75% { transform: translateX(-5px) rotate(-5deg); }
  100% { transform: translateX(0) rotate(0); }
}

#hoverButton {
  animation: shake 0.5s infinite;
}

var button = document.getElementById('hoverButton');

button.addEventListener('mouseover', function() {
  button.classList.add('hover');
});

button.addEventListener('mouseout', function() {
  button.classList.remove('hover');
});