在博客中实现播放音乐功能(QQ,网易,酷狗,虾米,百度)
1、在页头head标签里添加:
<link rel="stylesheet" href="https://static.likepoems.com/cdn/aplayer/APlayer.min.css">
<script src="https://static.likepoems.com/cdn/aplayer/APlayer.min.js"></script>
<script src="https://static.likepoems.com/cdn/aplayer/Meting.min.js"></script>
2、在页脚footer标签里(/body前)添加:
<div>
<meting-js
server="tencent"
type="playlist"
id="8268823919"
fixed="true"
autoplay="false"
loop="all"
preload="auto"
volume="0.6"
list-folded="true"
list-max-height="500px"
>
</meting-js>
</div>
3、相应配置
常见的配置:
参数 | 默认 | 描述 |
---|---|---|
server | 无 | 音乐平台:netease, tencent, kugou, xiami, baidu |
type | 无 | 播放的音乐类型,值:song, playlist, album, search, artist |
id | 无 | 歌曲id/播放列表id/专辑id/搜索关键字 |
mini | false | 迷你模式 |
fixed | false | 启用固定模式, 默认位置在左下角 |
autoplay | false | 音频自动播放 |
order | false | 排序,值:list, random |
loop | all | 循环播放,值:all, one, none |
preload | auto | 预加载,值:'none', 'metadata', 'auto' |
volume | 0.7 | 音量,值:0~1 |
list-folded | false | 表示歌单列表是否折叠 |
list-max-height | 无 | 示歌单列表的最大高度 |
在博客中实现播放音乐功能(QQ,网易,酷狗,虾米,百度)的更多相关文章
- 在CSDN博客中添加量子恒道统计功能的做法
作者:朱金灿 来源:http://blog.csdn.net/clever101 什么是量子恒道统计?量子恒道统计是一套免费的网站流量统计分析系统.致力于为所有个人站长.个人博主.所有网站管理者.第三 ...
- 个人博客添加网易云音乐Flash插件
博客底部添加网易云音乐播放插件 歌单或者歌曲外链可从音乐界面"生成外链播放器"中得到,选择Flash播放插件即可 footer.html文件增加 实现效果: 历史精选文章: Jli ...
- 主题博客添加 h5 贴边音乐插件
前言: 前几日,在逛微博的时候,发现微博主页的左下角有一个贴边的音乐小插件,我顿时就想在自己博客上也弄一个玩玩.当时就想把微博那个移植过来,首先我用谷歌浏览器F12 查看页面源码,和检查元素代码,发现 ...
- 在hexo静态博客中利用d3-cloud来展现标签云
效果: http://lucyhao.com/tags/ hexo自带的tag cloud的标签展现不太美观,想能够展现出“云”效果的标签.在网上找到了d3-cloud这个项目,github地址:ht ...
- Django1.9开发博客(7)- 实现功能
到目前为止我们已经完成了一个django应用的所有基础部分. 包括url配置.视图.模型和模板.接下来开始继续完善我们的博客系统了. 首先我们需要一个显示每篇文章的详细页面,对不? 文章详情 对于首页 ...
- 在个人博客中优雅的使用Gitalk评论插件
在上一篇博客<程序员如何从0到1搭建自己的技术博客>中,我们了解了如何快速的从0到1搭建一个个人博客. 其实细心的你会发现,该博客用到了一个评论插件,这个插件就是Gitalk. 如果想要在 ...
- 如何将word中的图片和文字导入自己的博客中
目前大部分的博客作者在用Word写博客这件事情上都会遇到以下3个痛点: 1.所有博客平台关闭了文档发布接口,用户无法使用Word,Windows Live Writer等工具来发布博客.使用Word写 ...
- 怎样将word中的图片插入到CSDN博客中
目前大部分的博客作者在用Word写博客这件事情上都会遇到以下3个痛点: 1.所有博客平台关闭了文档发布接口,用户无法使用Word,Windows Live Writer等工具来发布博客.使用Word写 ...
- 如何在hexo博客中在线阅读pdf
前言 有一些资料或者笔记是pdf版本的,如果想要放在博客中进行阅读,那么就得将其转换为markdown格式或者html格式.但是这样转换后,其原pdf的格式就会混乱了,排版将会变得很困难,不过一山更比 ...
随机推荐
- Word 常识备忘录
一句科普 名词解释 左右页边距 正文到纸左右两边之间的间距. 分页符 分页符是分页的一种符号,上一页结束以及下一页开始的位置. 分栏符 分栏的页面使用分栏符可以使一列分栏的段落排列到另一栏. 邮件合并 ...
- package.json 与 package-lock.json 的关系
模块化开发在前端越来越流行,使用 node 和 npm 可以很方便的下载管理项目所需的依赖模块.package.json 用来描述项目及项目所依赖的模块信息. 那 package-lock.json ...
- 年轻的樵夫哟,你掉的是这个免费 8 核 4G 公网Docker 服务器
Play With Docker 直接打开 https://labs.ply-with-docker.com/ 即可访问 Play With Docker 平台. 注册一个 DockerHub 账号便 ...
- 弹簧高跷题解---双向DP---DD(XYX)的博客
三 . 弹簧高跷 时间限制: 1 Sec 内存限制: 128 MB 题目描述.输入.输出 ----------- 方法 这道题用DP是可以解决的.因为每一次跳跃都与前一次跳跃有关, ...
- (WebFlux)003、多数据源R2dbc事务失效分析
一.背景 最近项目持续改造,然后把SpringMVC换成了SpringWebflux,然后把Mybatis换成了R2dbc.中间没有遇到什么问题,一切都那么的美滋滋,直到最近一个新需求的出现,打破了往 ...
- this的指向问题、bind/call/apply改变this指向
this的指向问题 全局作用域下的this指向 无论是否是严格模式,全局作用域下的this始终指向window 函数内部的this 严格模式下: function test() { 'use stri ...
- std:move() 作用 和 移动语义后 右值行为,unique_ptr的"移动"操作问题
unique_ptr 不能进行赋值操作,但是可以有返回unique_ptr的函数,由此产生的问题: 结论1:std:move() 只是将一个实参强行转换为右值引用. 我们知道对象初始化时有 构造函数, ...
- Django 目录
1 Python Web开发主流框架 2 Django 简介和版本介绍 3 Django 使用cmd 创建工程 4 Django 创建 APP和目录结构介绍 5 Django 使用VScode 创建工 ...
- kibana知识点
1.Kibana 有 Linux.Darwin 和 Windows 版本的安装包.由于 Kibana 基于 Node.js 运行,我们在这些平台上包含了一些必要的 Node.js 二进制文件.Kiba ...
- (Bug修复)C#爬虫,让你不再觉得神秘
Bug修复 https://github.com/ZhangQueque/quewaner.Crawler/issues/1 修复加载Https网址中午乱码,导致Node解析失败的问题 1.使用第三方 ...