Добрый вечер , подскажите пожалуйста , как зациклить анимацию картинки , что бы она плавно увеличивалась и уменьшалась до тех пор пока не навести на неё курсор ?
Есть такой код css
<style type="text/css">
.hovergallery img{
-webkit-transform:scale(0.9);
-moz-transform:scale(0.9);
-o-transform:scale(0.9);
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
/opacity: 0.7;/
margin: 0 0px 0px 0;
}
.hovergallery img:hover{
-webkit-transform:scale(1.0);
-moz-transform:scale(1.0);
-o-transform:scale(1.0);
box-shadow:0px 0px 0px gray;
-webkit-box-shadow:0px 0px 0px gray;
-moz-box-shadow:0px 0px 0px gray;
opacity: 1;
}
</style>
Но он работает при наведении курсора - увеличивает , курсор убираем - уменьшает .
Как сделать зацикленное плавное увеличение/уменьшение до наведении курсора на картинку ?
Спасибо . Вот примерно как то так.webm
