egor8
20.09.2021, 15:24
Сейчас работает вращение картинки при помощи наведения мыши.
Необходимо запустить, чтоб работало при перемещении бегунка браузера или вращения колеса мыши.
<!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> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</body>
</html>
Необходимо запустить, чтоб работало при перемещении бегунка браузера или вращения колеса мыши.
<!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> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</body>
</html>