點(diǎn)擊光盤不能停止
window.onload=function(){
? ?var music=document.getElementById("music");
? ?var audio=document.getElementsByTagName("audio")[0];
? ?//當(dāng)音樂停止時(shí)光盤停止旋轉(zhuǎn)
? ?audio.addEventListener("ended",function(event){
? ? ? ?music.setAttribute("class","");
? ? ? ?//music.style.animationPlayState="paused";
? ? ? ?//music.style.webkitAnimationPlayState="paused";
? ?},false);
? ?music.onclick=function(){
? ? ? ?if(audio.paused){
? ? ? ? ? ?audio.play()
? ? ? ?}else{
? ? ? ? ? ?audio.pause()
? ? ? ?}
? ?}
}
/*all tag*/
*{font-size: 1.5625vw;font-family: 微軟雅黑;}
html,body{height: 100%;overflow: hidden;}/*music*/
.music{width: 15vw;height: 15vw;position: fixed;top: 3vh;right: 3vw;border: 4px solid #ef1639;z-index: 5;border-radius: 50%;}
.music img:first-of-type{ width: 79%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }
.music img:last-of-type{width: 28.421%;position: absolute;top: 24%;right: 2.5%;margin: auto;}
.play{-webkit-animation: music_disc 4s linear infinite;animation: music_disc 4s linear infinite; ?}
@keyframes music_disc {0%{-webkit-transform: rotate(0deg);transform: rotate(0deg);}100%{-webkit-transform: rotate(360deg);transform: rotate(360deg); ?} }
@-webkit-keyframes music_disc {0%{-webkit-transform: rotate(0deg);transform: rotate(0deg);}100%{-webkit-transform: rotate(360deg);transform: rotate(360deg);} }
2016-05-05
你都還沒控制music的class，怎么會停呢，還有就是有兩句后面怎么會沒有分號的
music.addEventListener("touchstart",function(event) {
if (audio.paused) {
audio.play();
this.setAttribute("class","play");
}else{
audio.pause();
this.setAttribute("class","");
};
},false);
2016-05-05
<div class="music">
? ?<img id="music" class="play" src="images/music_disc.png" />
? ?<img ?src="images/music_pointer.png" />
</div>