HTML+CSS+JS做一个简易音乐播放器

先给大家看下效果：

实现功能：音乐播放，歌词跟随进度滚动，中间随着音乐播放图片360度旋转

文件目录：

做一个播放器，音乐和歌词事先要下载好，搜一些自己喜欢的封面，让图片360度旋转的样式，通过按钮增删样式达到跟音乐同步进行：

.img{
            animation: img 18s linear infinite;
            -moz-animation: img 18s linear infinite;
            -webkit-animation: img 18s linear infinite;
            -o-animation: img 18s linear infinite;
            animation-play-state:paused;
        }

        .running{
            animation-play-state:running;
        }

        .stop{
            animation-play-state:paused;
        }

// 播放
    play.onclick = function(){
        if(audio.paused){
            audio.play();
            document.getElementById("musicImg").classList.remove("stop");
            document.getElementById("musicImg").classList.add("running");
        }

    }
    // 暂停
    pause.onclick = function(){
        if(audio.played){
            audio.pause();
            document.getElementById("musicImg").classList.remove("running");
            document.getElementById("musicImg").classList.add("stop");
        }
    }

其中歌词匹配才是让我头疼的，所有JS代码部分：

需要所有源码，可以去github上自行下载：
https://github.com/lzs1996/MusicPlayer.git