如何在css中产生Hover的相反效果

Question

我有以下代码：

img:hover {
  -webkit-animation:spin 0.5s linear forwards;
  -moz-animation:spin 0.5s linear forwards;
  animation:spin 0.5s linear forwards;
}

@-moz-keyframes spin {
    100% {
        -moz-transform: rotatey(360deg);
    }
}

@-webkit-keyframse spin {
    100% {
    -webkit-transform: rotatey(360deg);
    }
}
@keyframes spin {
    100% {
        -webkit-transform: rotatey(360deg);
        transform:rotatey(360deg);
    }
}

See live demo here

我有一个在悬停时自行旋转的图像。我想在悬停时发生同样的效果。

如何实现？