Как я могу анимировать свое изображение бесконечно, используя CSS3
У меня есть изображение, которое имеет эти стили:
<img src="images/head-tails.gif" class="graphs" />
.graphs {
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease;
-o-transition: all 2s ease;
transition: all 2s ease;
/* -webkit-animation:animated 5s infinite; */
/* -moz-animation:animated 5s infinite; */
/* -o-animation:animated 5s infinite; */
/* animation:animated 5s infinite; */
}
.graphs:hover {
-webkit-transform: rotateY(360deg);
-moz-transform: rotateY(360deg);
-o-transform: rotateY(360deg);
transform: rotateY(360deg);
}
Поэтому, когда я наводю курсор на изображение, оно поворачивается на 360 градусов, как монета. Хотя я хотел бы сделать, чтобы при загрузке страницы изображение выполняло эту анимацию (вращение) бесконечно, без необходимости наводить курсор мыши. Как я могу сделать эту работу?