众所周知,Aplayer是个好东西

本人就把那沙雕的按钮迁移成Aplayer
Aplayer挺好看的QAQ
本人使用的代码如下:

 <link rel="stylesheet noreffer" href="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.css" >
 <div id="aplayer">
 </div>
 <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.js" rel="noreferrer"></script>
 <!--    <script type="text/javascript" src="https://stevenmhy.tk/dist/music.js" rel="noreferrer"></script>-->
 <script rel="noreffer" language="javascript" type="text/javascript">
    const ap = new APlayer({
    container: document.getElementById('aplayer'),
     autoplay: false,
    fixed: true,
    volume: 0.7,
    listMaxHeight: "100px",
    audio: [
    {
        name: '前前前世',
        artist: 'RADWIMPS',
        url: 'https://ks-mc-stg.oss-cn-hongkong.aliyuncs.com/3.mp3',
        cover: 'https://cn-south-17-aplayer-46154810.oss.dogecdn.com/yourname.jpg',
        lrc: 'https://cn-south-17-aplayer-46154810.oss.dogecdn.com/yourname.lrc',
    },{
         name: 'remember',
        artist: 'Uru',
        url: 'https://ks-mc-stg.oss-cn-hongkong.aliyuncs.com/2.mp3',
        cover: 'http://static.missevan.com/coversmini/201809/26/99f6510210cc335761647a288452ae31132723.jpg',
    },
     {
        name: '夢灯籠',
        artist: 'RADWIMPS',
        url: 'https://ks-mc-stg.oss-cn-hongkong.aliyuncs.com/5.mp3',
        cover: 'https://gitee.com/steven_meng/music/raw/master/cover/kiminonawa.jpg',
    },{
        name: 'Jumping!!',
        artist: 'Rhodanthe *',
        url: 'https://ks-mc-stg.oss-cn-hongkong.aliyuncs.com/4.mp3',
        cover: 'https://i.loli.net/2019/10/26/vBKlAoWrzPVLZh1.png',
    },
    {
        name: ' 茜さす(夏目友人帐第5季 ED)',
        artist: 'Aimer',
        url: 'https://ks-mc-stg.oss-cn-hongkong.aliyuncs.com/1.mp3',
        cover: 'https://i.loli.net/2019/10/26/DC49OtFi2jY3TXW.png',
    },
    
    ]
   });
</script>

效果图欣赏

image.png
image.png
image.png