// JavaScript Document
var music=document.getElementById("mymusic");
    var prograss=document.getElementById("prograss");
    var curtxt=document.getElementById("currenttime");
    var duration=document.getElementById("duration");
    var music_pic=document.getElementById("music_pic");
    var deg=0;//旋转角度
    var disctimer,prograsstimer;//碟片计时器,进度条计时器
    var musicindex=0;//音乐索引
    var musics=new Array("nicengshishaonian.mp3","huanian.mp3","chunfengshili.mp3");//音乐数组
    var music_pics=new Array("000002","000001","000001");
    
    
    //旋转碟片
    var disc=document.getElementsByClassName('disc');
        
        //音乐时间显示
        function curtime(txt,misic)
        {
            if(music.currentTime<10)
                {
                    txt.innerHTML="0:0"+Math.floor(music.currentTime);
                }else
            if(music.currentTime<60)
                {
                    txt.innerHTML="0:"+Math.floor(music.currentTime);
                }
            else
                {
                    var minet=parseInt(music.currentTime/60);
                    var sec=music.currentTime-minet*60;
                    if(sec<10)
                        {
                            txt.innerHTML="0"+minet+":"+"0"+parseInt(sec);
                        }
                    else
                        {
                            txt.innerHTML="0"+minet+":"+parseInt(sec);
                        }
                }
        }
        
        //播放暂停
        function playPause()
        {
            var btn=document.getElementById("playbtn");
            if(music.paused)
                {
                    music.play();
                    clearInterval(disctimer);//清除碟片的定时器
                    btn.style.background="url(images/music/pictures/pause.png) no-repeat 10px";//改变播放暂停键的图标
                    disctimer=setInterval(function(){
                    disc[0].style.transform="rotate("+deg+"deg)";
                    deg+=5;
                        
                    //每秒设置进度条长度
                    },100);
                    prograsstimer=setInterval(function(){
                    prograss.style.width=(music.currentTime)*100 / (music.duration)+"%";
                    curtime(curtxt,music);
                    if(music.currentTime>=music.duration-1)//片尾跳转下一曲
                    {
                        musicindex++;//音乐索引加一
                        if(musicindex>=musics.length)//如果音乐索引超过长度，将音乐索引清零
                        {
                            musicindex=0;
                        }
                        getMusic();
                        music.play();//重载音乐后进行播放
                    }
                    },1000);
                }
            else
                {
                    music.pause();//停止音乐
                    btn.style.background="url(images/music/pictures/play.png) no-repeat 10px";
                    clearInterval(disctimer);//清除碟片滚动的定时器
                    clearInterval(prograsstimer);//清除进度条的定时器
                }
        }
    
    //下一曲
    function nextMusic()
    {
        musicindex++;//音乐索引加一
        if(musicindex>=musics.length)//如果音乐索引超过长度，将音乐索引清零
            {
                musicindex=0;
            }
        getMusic();
        music.play();
    }
    
    //上一曲
    function backMusic()
    {
        musicindex--;
        if(musicindex<0)//如果索引小于0，将索引变为最大值
            {
                musicindex=musics.length-1;
            }
        getMusic();
        music.play();
    }
        
    //读取音乐
        function getMusic()
        {
            music.src="images/music/"+musics[musicindex];//改变音乐的SRC
            music_pic.src="images/music/pictures/"+music_pics[musicindex]+".jpg";
            if(music.readyState="complete")
                {
                    setTimeout(function(){
                        duration.innerHTML=parseInt(music.duration/60)+":"+parseInt(music.duration%60);
                    },1000);//一秒后读取音乐的总时长
                    
                }
        }
        
    
        window.onload=function(){
            getMusic();
            
        }

View Code