点击光盘后音乐停止,可是光盘还是会变形
window.onload = function () { var music = document.getElementById("music"); var audio = document.getElementsByTagName("audio")[0]; audio.addEventListener("ended", function (event) { music.setAttribute("class", ""); }, false); music.addEventListener("touchstart",function (event) { if (audio.paused) { audio.play(); this.setAttribute("class"," music_play"); //this.setAttribute("class","music_play"); //停止时变形 // this.style.animationPlayState="running"; 兼容性不行 } else { audio.pause(); this.setAttribute("class",""); //this.style.animationPlayState="paused"; } },false); };
CSS部分:
.music > img.music_disc { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 79%; margin: auto; z-index: 0; } .music > img.music_play { -webkit-animation: music_disc 4s linear infinite; -o-animation: music_disc 4s linear infinite; animation: music_disc 4s linear infinite; }