博客园添加背景音乐以及播放器 或在左下方固定位置添加音乐播放器 给你的博文锦上添花，增姿添彩 |
您所在的位置：网站首页 › 网易云我的博客怎么上传歌曲 › 博客园添加背景音乐以及播放器 或在左下方固定位置添加音乐播放器 给你的博文锦上添花，增姿添彩 |
博客园添加背景音乐以及播放器 或在左下方固定位置添加音乐播放器 给你的博文锦上添花，增姿添彩
|
官方教程：https://aplayer.js.org/#/zh-Hans/
一、第一种样式
这种你想添加多少音乐就添加多少音乐！
将下方代码复制到博客侧边栏！
只需要在进入163网易云音乐，随便打开一首你喜欢的歌曲，在地址栏中的末尾会出现歌曲的数字标识符，把它复制过来，添加到下面的公式上就好。 或者点击生成外链播放器也可查看 ，数字都是一样的！ 如：
公式为：http://music.163.com/song/media/outer/url?id=****.mp3
把 id 覆盖掉 **** 号即可 这种方式不易出错！ 2.效果演式
始终停留在左下角 ，滚动也是如此！ 取消固定 即将fixed赋值为false，则播放器会到侧栏中！
二、第二种样式 依旧放在博客侧边栏（这个是单音乐类） 另一个模式：单音乐 var iii = document.createElement('iframe'); iii.src = '//music.163.com/outchain/player?type=2&id=28996922&auto=1&height=66'; iii.height = 86; iii.width=200; $("#aplayer").after(iii);
2.效果演示
二、第三种样式
这种方法就不那么麻烦了，直接用自己的歌单就行，不用像第一种样式自己一个一个加音乐到歌单代码里了！！
这个跟前面不一样，这个代码要放到页脚/页首！ 想要自动播放的话，就添加data-autoplay="true"到第三行代码div后面 mini: false, //迷你模式 autoplay: false, //自动播放 theme: '#FADFA3', //主题色 loop: 'all', //音频循环播放, 可选值: 'all'全部循环, 'one'单曲循环, 'none'不循环 order: 'random', //音频循环顺序, 可选值: 'list'列表循环, 'random'随机循环 preload: 'auto', //预加载，可选值: 'none', 'metadata', 'auto' volume: 0.7, //默认音量，请注意播放器会记忆用户设置，用户手动设置音量后默认音量即失效 mutex: true, //互斥，阻止多个播放器同时播放，当前播放器播放时暂停其他播放器 listFolded: false, //列表默认折叠 listMaxHeight: 90, //列表最大高度 lrcType: 3, //歌词传递方式 server 可选 netease（网易云音乐），tencent（QQ 音乐），kugou（酷狗音乐），xiami（虾米音乐）， baidu（百度音乐）。 type 可选 song（歌曲），playlist（歌单），album（专辑），search（搜索关键字），artist（歌手） id 获取示例：浏览器打开网易云音乐，点击我喜欢的音乐歌单，地址栏有一串数字，playlist 的 id 即为这串数字。
将这串数字替换代码中data-id后面的数字即可！
2.效果演示
有问题大家多多交流！请大家雅正！
|
【本文地址】
公司简介
联系我们
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |