點擊光盤后音樂停止,可是光盤還是會變形
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;
}
2017-03-09
這個不兼容啊
2017-03-09
music.onclick = function(){
if (audio.paused) {
audio.play();
// this.setAttribute("class","play");
?this.style.webkitAnimationPlayState="running";
}else{
audio.pause();
// this.setAttribute("class","");
? ? this.style.webkitAnimationPlayState="paused";
};
};我添加的是onclick 事件就可以親也試一下