Есть два элемента в виде диска когда я нажимаю на кнопку включение вращается только один диск. А как сделать так что бы при нажатии на кнопку включалось оба диска один вращался в лево другой в право
var sound = document.getElementById('sound');
var img = document.getElementById('rotateImg');
var img = document.getElementById('rotateImg2');
function rotate(action) {
img.style.animationPlayState = action;
if (action =='running') { sound.play()
} else { sound.stop() }
}
#rotateImg {
animation: 1s myRotate infinite linear paused;
}
#rotateImg2 {
animation: 1s myRotate infinite linear paused;
}
@keyframes myRotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.circle{
border-radius: 100%;
background: red;
width: 100px;
height: 100px;
}
<div class="wrapper">
<img class="circle" id="rotateImg">
<img class="circle" id="rotateImg2">
</>
<audio id="sound" src="http://www.html5tutorial.info/media/vincent.ogg"></audio>
<button onclick="rotate('running');">Крутить пластинку</button>
<button onclick="rotate('paused');">Остановить</button>
Свежие комментарии