YoduPlayer背景音乐播放器发布

Typecho杂文 typecho 插件 播放器 instantclick 2017-04-14

YoduPlayer

YoduBGM之后的另一款支持instantclick的背景音乐播放器。

特点

0,支持自定义播放器css。
1,支持使用pjax或者instantclick的模板。
2,内置多种播放器皮肤,可自由选择
3,可设置自动播放,手机端自动隐藏等
4,无JQ[早期打包版本无需jq],要求浏览器ie9+
5,有上一曲,下一曲,暂停/播放,封面显示等功能,封面播放时会旋转。
6,针对typecho的Yodu主题模板字体方面做过处理,减少多余字体加载,2.2.2之前的版本支持针对模板变色功能,2.2.2版本之后需要根据需求手动选择播放器皮肤。
7,歌曲列表功能支持,正在播放的歌曲在列表中标注支持。

小问题

1,与yodubgm应该会有冲突,建议他俩之间只是用一个。
2,与其他的模板样式上可能会遇到冲突。
3,歌曲虽然可以解析网易云音乐,但不保证不会出现部分音乐无法播放的可能性

背景

因为前天有人吐槽YoduBGM太过简洁,于是昨天中午重写了个样式,js代码部分抄自己之前写的yodubgm的代码,音乐播放时间格式化借鉴与Qplayer,其余的都是现写的,边百度边写233。本来没想做成插件,想内置到模板里,但是貌似不利于传播,于是刚刚封装进了插件。

测试

有部分模板可能会出现错位等现象……

截图

yoduplayer演示.gif

下载地址

https://github.com/jrotty/YoduPlayer

更新记录

2018,05,28
默认音量调低至18%,默认本地歌曲,多皮肤机制公开手动选择,不在支持yodu模板自动变色功能,请手动选择皮肤,版本号2.2.2
2018,02,25
新增随机播放功能,简单优化,yodu定制皮肤会根据模板自动勾选
2017,12,10
封面图404时,自动将内置图片补上去假装图没挂,播放器外面点击关闭抽屉,优化yodu模板的定制皮肤,版本号1.8.0
2017,12,06
增加默认音乐与封面图【当音乐列表为空时默认填充】(内置音乐只要非盈利性质则不涉及版权问题),版本号1.7.5
2017,10,09
歌曲列表正在播放的歌曲加入样式标注,发布测试版1.7.3
2017,10,08
加入了歌曲列表功能,发布测试版1.7.0
2017,10,01
修复部分浏览器抽屉失效问题,增强浏览器兼容性
2017,09,27
部分浏览器进度条错位问题修复
2017,07,27
修正进度条定位问题,版本号1.3.0。
2017,07,25
解决部分模板的字体冲突问题
2017,07.10
重新加入修复版的网易音乐获取api,版本号1.2.0。
2017,06.12
支持显示音乐播放进度条,删除已经失效的网易云api,版本号 1.1.0。
2017.04.16
修复上下曲切换播放封面不旋转问题,修复列表播放不循环问题,版本号1.0.1。
2017.04.15
加入自定义css,加入yodu主题模板定制化方案,版本号为1.0.0
2017.04.14晚
修正css使其兼容更多模板,版本号为0.6.0
2017.04.14
上传第一个版本,版本号为0.5.0

115条评论

    LOGI

    写了个生成网易云配置的页面,有需要的可以看看
    https://logi.ml/yoduplayer.html

    游客 Windows10 91 天前回复

    苏z

    巨佬,怎么才能在切换页面时,音乐不会每次都重新播放 。

    游客 Windows10 159 天前回复

      泽泽社长
      @苏z

      这个跟插件无关,需要模板支持pjax

      作者 Windows7 159 天前回复

    贫小子

    我装好插件,也启动了,博客主页面却看不到这个插件,也没播放音乐,这是咋回事

    游客 Windows7 161 天前回复

      泽泽社长
      @贫小子

      可能是模板没写插件接口或者与模板样式冲突

      作者 Windows7 161 天前回复

        云滨
        @泽泽社长

        你的GitHub的项目中没有jQuery,也没有提示和设置,应该是这个原因。

        游客 Windows10 131 天前回复

    雪村唯

    大佬你好,我发现就算我修改了css,这个播放器的位置还是不会变,是什么情况呢。

    游客 MacOS 250 天前回复

    年轻肆无忌惮

    大佬主题真好用

    游客 Windows10 322 天前回复

    清心

    怎么修改友链前面 @ 这个图标,我想修改一个其他的,求大神解释。

    游客 安卓奥利奥 333 天前回复

    vrok

    很棒,就是随机播放那个只是第一次播放时随机开始,如果能实现自动连续播放时也是随机顺序,点击上一曲和下一曲也是随机顺序就好了。

    游客 安卓奥利奥 339 天前回复

    清酒踏月

    泽泽大佬,怎么可以让他出现在网站的其他地方而不是右上角

    游客 Windows7 354 天前回复

      Jrotty
      @清酒踏月

      修改css吧

      作者 Windows10 353 天前回复

    传奇三国际版

    不会自动播放,该从哪找原因?

    游客 MacOS 393 天前回复

    Rst.WL

    小白过来顶顶

    游客 Windows10 477 天前回复

智能推荐