html音乐播放器 利用css和js知识来创建一个音乐播放器(虽然简陋,但是逻辑很容易懂,适合初学者)

作为初学者,制作一个网页播放器来提高我们编写代码水平很有用

这是css部分,很简单,随便信息样式就行

.musicDiv{
        width: 250px;
        height: 70px;
        background-color: red;
        position: relative;
        overflow: hidden;
    }
    .xia,.kais,.shang{
        width: 60px;
        float: left;
    }

    .musicAdress{
        height: 70px;
        
    }
    i{
        line-height: 70px;
        text-align: center;
        font-style: normal;
        font-size: 50px;
        padding-left: 22.5px;
    }

这里是js部分,我思路是先给播放键绑定事件,按下播放键为每一首歌曲绑定监听事件,记录他们播放结束,当播放结束后,歌曲会自动切换为下一首,用一个x来记录我当前播放歌曲的序号,

然后通过x+1来自动切换到下一首,而这个index是为手动切换上下歌曲服务的,这里用index来记录我当前播放歌曲,上下手动切换通过index--,index++实现。


                    
                    

你可能感兴趣的:(静态项目(js),javascript,css,html)