1分钟技能GET：每天提供一项实用技能
不管你是QQ音乐热心用户、网易音乐爱好者还是虾米音乐的粉丝，只要你符合以下两个特征，这篇文章就是为你准备的：
（1）希望有逼格地分享自己喜欢的音乐；
（2）愿意多学一门实用又好玩的互联网技艺。
首先，音乐交互的实现需要使用H5页面制作工具iH5——请在电脑端打开网站www.ih5.cn，点击右下角的“新建案例”开始制作。H5音乐的交互之旅就此启程！
【1】添加音频
如上图，点击“音频”图标，就能通过上传或添加外链为H5页面加音乐。音乐的上传自不必多说，国内大部分H5页面制作工具都能实现，但他们都要求单个音频大小在5M之内。如何破除这个魔咒？
别浪费了iH5自定义音乐地址的功能，直接用外链！外链相当于存储音乐的地址，也能用来*载下**音乐，因此只需要把它填在“资源位置”就行。
还好音乐盈利空间没有视频那么大，其实获取QQ、网易、阿里、百度音乐的外链，你在网上随便一搜（比如百度“虾米音乐外链”），都有公开的方法。当然这算是一个“灰色地带”，地址大多是第三方网站自己解析出来的。
原理是换掉这些外链里的ID。比如虾米音乐外链是http://link.hhtjim.com/xiami/1769962750.mp3，你把“.mp3”前面那串数字换成歌曲ID就行。而虾米的歌曲ID是点击歌曲名进入内容页，页面网址里“song/”后面那串数字。
（2）音频的控制
近期比较迷80年代的欧陆舞曲，顺便用三首迪斯科舞曲做个简易版播单。如上图，主要通过设计一个替换音乐外链的事件来实现。
iH5允许对音频做6种控制：（1）设置属性（2）继续*放播**（3）从头*放播**（4）暂停（5）*载下**（6）从某个时刻开始*放播**。其中，设置属性就能用来修改音频外链。
比如上面设计第二首歌的*放播**，只需要设定点击按钮时，音频的资源位置变成对应的外链， 再加个让音乐从头*放播**的事件就行。
（3）植入现成歌单
咦，你是懒癌患者？那最后这个大招最适合你了，不仅快效果还好，直接嵌入音乐网站现成的*放播**器和歌单吧。
如上图，网易在歌单页面里有一个“生成外链*放播**器”的按钮。点进去是iframe和flash两种*放播**器插件，你需要做的是复制出前者的HTML代码。
如果用后面的flash*放播**器，没有越狱的苹果用户估计会听不了。
如图，新建一个富文本，激活HTML代码编辑模式，把这串代码粘贴进去就OK了。当然，需要注意的是，*放播**器的宽（width）和高（height）需要通过修改代码进行设置。最后点击预览，你就会发现页面已经“植入”了网易的MP3*放播**器。
但这种*放播**器有一点缺陷，不能通过触摸页面滑动歌单，还需要点击右侧那个细细的滑块，才能控制歌曲列表的位置。
虾米也提供外嵌入*放播**器，但取它的代码比较隐晦，得在歌曲页面下方“设置”那个按钮选“生成虾米播播”才行——而且它的*放播**器比较丑，不建议使用。