html:
<audio src="bg.mp3" id="Jaudio" class="media-audio" autoplay preload loop="loop"></audio>
-controls : 显示标准的 HTML5 视频/音频播放器控制条、控制按钮。
-autoplay : 让文件自动播放。
-loop : 让文件循环播放。
-preload 属性是用来缓存大体积文件的。它有三个可选值:
"none" 不缓存
"auto" 缓存
"metadata" 只缓存文件元信息
js:
关于音乐自动播放的问题,现在可以分为三种:
1-支持audio的autoplay,大部分安卓机子的自带浏览器和微信,大部分的IOS微信(无需特殊解决)
2-不支持audio的autoplay,部分的IOS微信(本文提供的解决方案)
3-不支持audio的autoplay,部分的安卓机子的自带浏览器(比如小米,开始模仿safari)和全部的ios safari(这种只能做用户触屏时就触发播放了)
注意:
MP3 在进行商业传播时需要支付繁重的版税。MP3 的授权要求对于所有超过 $100K 的数据收取 2% 的传播费,所以尽可能少用MP3,而选用其他格式文件:Ogg Vorbis WAV PCM AAC
ios safari的自动加载音频,需要由用户接触事件,比如通过 onmousedown、onmouseup、onclick 或 ontouchstart 触发事件,否则不能加载音频流
更多细节:
https://www.ibm.com/developerworks/cn/web/wa-ioshtml5/index.html
更多控制:(实现播放、暂停、快进,快退、音量等。)
http://know.webhek.com/html5/html5-video-audio.html