你好，我有麻烦把css过渡和动画结合在一起。动画是工作，但不知什么原因，当我添加一个过渡，过渡工作，但取消了动画。有人知道如何合并他们吗？
下面是我的CSS：

.circle-spin {
    transition: all 1s ease;
}

.circle-spin-reverse {
    transition: all 1s ease;
}

.success li:hover .circle-spin-reverse {
    animation:spin-reverse 10s linear infinite;
    /* the above works until i add the transition below */

    transform:scale(1.25);
}

.success li:hover .circle-spin {
    animation:spin 10s linear infinite;
    /* the above works until i add the transition below */

    transform:scale(1.25);
}

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

对不起，我知道这是大量的代码，但这是这个问题所需的最低限度的代码。
谢谢