要实现按钮的图像旋转动画，可以使用CSS3的转换属性和动画属性来实现。以下是一个示例代码：

HTML代码：

按钮

CSS代码：

#rotate-btn {
  width: 100px;
  height: 100px;
  background-image: url('button-image.png');
  background-size: cover;
  transition: transform 0.5s ease-in-out;
}

#rotate-btn.rotate {
  transform: rotate(180deg);
}

@keyframes rotate-animation {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

JavaScript代码：

const rotateBtn = document.getElementById('rotate-btn');

rotateBtn.addEventListener('click', function() {
  rotateBtn.classList.toggle('rotate');
});

在上面的代码中，我们使用了transform属性来实现按钮图像的旋转效果。按钮的默认样式使用了transition属性来指定动画效果的持续时间和缓动函数。当按钮被点击时，我们使用classList.toggle()方法来切换按钮的rotate类，从而触发或停止旋转动画。

同时，我们还定义了一个@keyframes规则，命名为rotate-animation，用于定义图像旋转的动画效果。通过将transform属性的值从0度变化到360度，我们可以实现按钮图像的旋转动画。

你可以根据自己的需要修改代码中的样式和动画属性，以适应你的具体场景。