QQ爹の博客 QQ爹の博客

YoduPlayer背景音乐播放器发布

in Typecho read (2976) 494汉字 文章转载请注明来源!

YoduPlayer

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

特点

0,支持自定义播放器css。
1,支持使用pjax或者instantclick的模板。
2,歌单设置内置了网易云音乐解析
3,可设置自动播放,手机端自动隐藏等
4,无JQ,要求浏览器ie9+
5,有上一曲,下一曲,暂停/播放,封面显示等功能,封面播放时会旋转。
6,针对typecho的Yodu主题模板特殊优化,根据期多皮肤自动变色适应皮肤等。

小问题

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

背景

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

测试

目前没怎么测试,只是在我自己的模板上简单的跑了一下,没什么问题各项功能正常。

截图

默认这样

点击后这样

下载地址

https://github.com/jrotty/YoduPlayer

更新记录

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

jrotty WeChat Pay

微信打赏

jrotty Alipay

支付宝打赏

文章二维码

扫描二维码,在手机上阅读!

typecho插件播放器instantclick
最后由Jrotty编辑于2017-07-27 06:50
发表新评论
已有 59 条评论
  1. taru
    taru
    回复

    请问 有没有wp移植版 -v-

    1. taru
      taru
      回复

      @taru 好的,我知道用哪个了 打扰

  2. 长辞
    长辞
    回复

    完美兼容,希望能添加随机播放的

  3. Sakura
    Sakura
    回复

    你这的播放器的进度条错位了。。。

    1. Jrotty
      Jrotty本文作者
      回复

      @Sakura 我记得我修复过这个bug了呀

  4. Sakura
    Sakura
    回复

    这个播放器chromium下是不是要专门设置下什么。。。

    1. Jrotty
      Jrotty本文作者
      回复

      @Sakura chromium没测试过,我通常都是chrom的

      1. Sakura
        Sakura
        回复

        @Jrotty 找到解决办法了,2333

        1. Jrotty
          Jrotty本文作者
          回复

          @Sakura 求dalao教教我

  5. 乱糟糟的小青年

    博主啊,这插件放到我网站上 ,那个符号图标就不行了,显示为 框 和fi,进度条也不是在最下面的? 这个 是咋回事?

    1. Jrotty
      Jrotty本文作者
      回复

      @乱糟糟的小青年 已更新github,再试试吧,看看解决与否

      1. 乱糟糟的小青年

        @Jrotty 图标是ok了,按右边控制键,中间播放暂停键不会显示出来,左边控制键会向右偏移,按左边控制键是正常的,不过我看进度条还是没有贴在最下面边框的位置

        1. Jrotty
          Jrotty本文作者
          回复

          @乱糟糟的小青年 又修了下,刚刚图标不显示纯属我手残,进度条修正了下,你在看看

          1. 乱糟糟的小青年

            @Jrotty O 了。现在可以了,感谢修复。

  6. Streamer
    Streamer
    回复

    IDExplain.php已死,获取不到mp3直连,貌似现在的api获取的都是缓存服务器的直连,博主有空可以改成访问一次获取一次直连。
    https://github.com/yeyuxingchen/music163API
    https://github.com/metowolf/Meting-Typecho-Plugin
    https://github.com/metowolf/Meting

    1. Jrotty
      Jrotty本文作者
      回复

      @Streamer 2017,07.10修复网易音乐获取 api

前篇 后篇

评论提交中...

雷姆
拉姆
音乐加载中...
0:00