Показать сообщение отдельно
  #1 (permalink)  
Старый 20.09.2021, 15:24
Аспирант
Отправить личное сообщение для egor8 Посмотреть профиль Найти все сообщения от egor8
 
Регистрация: 18.10.2014
Сообщений: 35

Запустить анимацию CSS вращения картинки
Сейчас работает вращение картинки при помощи наведения мыши.
Необходимо запустить, чтоб работало при перемещении бегунка браузера или вращения колеса мыши.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Документ без названия</title>
<style>

img.rot:hover { animation: 11s linear 0s normal none infinite running rot; -webkit-animation: 11s linear 0s normal none infinite running rot;  width: 600px;}
@keyframes rot {0% {transform: rotate(0deg);} 100% {transform: rotate(360deg);}}
@-webkit-keyframes rot {0% {transform: rotate(0deg);} 100% {transform: rotate(360deg);}}

</style>
</head>
<body>

<img class="rot" src="http://sirobogatov.site/wp-content/uploads/2021/09/about_circle.png" width="600" height="600">
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</body>
</html>
Ответить с цитированием