pix音乐播放器实现歌词显示、音量调节和伪自动播放

感谢"薄荷的猫草"提供音乐API实现歌词显示。

2023.10.29日在其基础上更新功能:

仅在手机播放时添加监听:手机播放状态下,监听播放状态,当暂停或播放结束时隐藏歌词,当恢复播放、重新播放或切换歌曲时重新显示歌词。电脑播放状态下维持目前不变,因为歌词在左下角,不影响页面浏览体验。

pix音乐播放器实现歌词显示、音量调节和伪自动播放-似水流年

歌词显示代码,复制下面代码放到pix设置-扩展设置-底部HTML代码。

温馨提示: 此处为隐藏内容,需要评论本文后才能查看.
评论后请刷新一次页面,但注意不要清除缓存,否则还需要再次评论!

点击任何位置自动播放,同上复制到pix设置-扩展设置-底部HTML代码。

<script>
    // 屏幕宽度大于768执行
    if (screen && screen.width > 768) {
        // 点击 body 任何位置就播放音乐,并只执行一次
        var body = document.querySelector('body');
        // 给 body 绑定 click 事件
        body.addEventListener('click', bj);
        function bj(){
            // 执行播放代码
            audiobox[0].play();//播放背景音乐
            audioplay(); //播放后执行的函数
            body.removeEventListener("click",bj);// 给 body 解除 click 事件绑定
        }
    }
         // 5s隐藏音乐播放器
    trigger = setTimeout(function(){
    mu_box_hide();
    },5000); // 5s隐藏音乐播放器
</script>

音量调节,添加到pix设置-扩展设置-自定义Javascript。修改var finalLong = 25;里的25即可。

    // 背景音乐音量调节
    var finalLong = 25;
    audiobox[0].volume = finalLong / 100;
    $('.vo_size').height(finalLong);
Comments | 5 条评论
  • SenLinM

    Microsoft Edge 120 Microsoft Edge 120 Windows 10 Windows 10 cn天津市 移动

    看看

    • Avatar photo

      似水流年

      IBrowse r IBrowse r Android 10 Android 10 cn河南省漯河市 联通

      欢迎😊

      • SenLin

        Microsoft Edge 120 Microsoft Edge 120 Windows 10 Windows 10 cn天津市 移动

        我的账号突然失效了

        • Avatar photo

          似水流年

          IBrowse r IBrowse r Android 10 Android 10 cn河南省漯河市 联通

          换了主题之后,这是个单用户博客。麻烦重新注册一下吧。😂

      • SenLin

        Microsoft Edge 120 Microsoft Edge 120 Windows 10 Windows 10 cn天津市 移动

        这是为什么 找回密码也没有

消息盒子
# 您需要首次评论以获取消息 #
# 您需要首次评论以获取消息 #

只显示最新10条未读和已读信息