取消时，CSS3 RotateY完成

Question

这是我的代码：

#body #body3 #big .item {
    display: block;
    -webkit-transition:all 1s ease-out;
    -moz-transition:all 1s ease-out;
    -ms-transition:all 1s ease-out;
    -o-transition:all 1s ease-out;
    transition:all 1s ease-out;
}

#body #body3 #big .item:hover {
    -webkit-transform:rotateY(360deg);
    -moz-transform:rotateY(360deg);
    -ms-transform:rotateY(360deg);
    -o-transform:rotateY(360deg);
    transform:rotateY(360deg);
}

问题是当我将鼠标悬停在项目上时，它会旋转，但当我将鼠标移开时会立即恢复到原始状态。那么，即使我将其悬停在一起，我怎样才能让它们完成360度旋转？