问题描述
在做网易云过程中遇到的一个问题，animation-play-state在微信内置浏览器和iosSafari中不起作用。导致歌曲播放动画无法暂停
解决方案
采用 css3 属性叠加1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19var isPlaying = false;
var container = document.querySelector(".container");
var disk = container.querySelector(".disk");
disk.addEventListener("click", function bindEvent() {
isPlaying ? pause() : play();
});
function pause() {
isPlaying = false;
var dTransform = getComputedStyle(disk).transform;
var cTransform = getComputedStyle(container).transform;
container.style.transform =
cTransform === "none" ? dTransform : dTransform.concat(" ", cTransform);
disk.classList.remove("active");
}
function play() {
isPlaying = true;
disk.classList.add("active");
}