网页设计教程与开发
提供各种常见网页效果
提供各种各样的设计教程
装扮QQ，让QQ变得更酷
设计参考，提高自升水平
学习服务器和操作系统
提供各种素材和工具
收藏学习资料
您现在的位置：&&>>&&>>&&>>&&>>&正文
HTML5免费资源:HTML5音频播放器资源免费下载
破洛洛文章简介：超炫的HTML5音频播放器和库.
dancer.js是一个高级音频API，可用于Mozilla的音频数据API和Webkit的网络音频，可以为你设计出一套可视化网络音频API。
1.使用实时音频数据并将其映射到任意的可视化；
2.音乐节奏拍子可以可视化；
3.简单的API可以让任何一首歌曲使用时间回调函数和事件；
4.可扩展的框架支持插件和自定义行为。
Buzz是一个用于操作HTML5音频标签的JavaScript library 。它是一个没有用到其它JavaScript框架独立Library。并拥有丰富的API可以用来管理这个音频标签提供的所有功能。支持的功能包括播放、 暂停、停止、循环和音量控、取得音频信息、判断音频类型是否支持、可同时处理多个音频文件。还可以取得播放结束、错误产生或音量变化等事件。
这个JavaScript Library提供了一种更加灵活的方式来使用HTML5的&audio&标签。
可以用它来制作一个Mp3播放器。当浏览器不支持&audio&标签时，它将自动换成Flash来支持Mp3文件的播放。
Thunder.js 是一个JavaScript库用于在你的浏览器轻松创建和播放音乐。
jPlayer是一个用于控制和播放mp3文件的jQuery插件。它在后台使用Flash来播放mp3文件，前台播放器外观完全可以使用XHML/CSS自定义。
JavaScript库用于播放音乐
破洛洛文章简介：超炫的HTML5音频播放器和库.
AudioFX Javascript 库，一个简单的HTML5 Audio Helper Library
SoundManager 2 利用 HTML5 和 Flash 技术提供了稳定和阔平台的音乐播放功能，只有 10K 的 JS 包。支持MP3, MPEG4 and HTML5 Audio等格式。
一个JavaScript库，它提供了一个简单的API，和强大的功能，使音频播放变得很简单。 跨浏览器支持的音频是目前一片混乱HTML5，但SoundJS的工作原理抽象出来的问题，使得添加声音到您的游戏或丰富的经验更容易。
Audiolet是一个JavaScript库，用于在浏览器中的实时音频合成和组成。它采用基于图形的路由和基于模式的调度，使复杂的音频编程简单，容易理解。
这是开源视频项目Kaltura.org 的核心。Kaltura的HTML5的媒体库，使您可以充分利用今天的HTML5视频和音频标签一致的播放器界面在所有主要的浏览器包括Internet Explorer。
MediaElement.js简单来说一个jQuery插件，它可以帮助你利用简单的与HTML5中的video和audio标签来播放音频与视频文件。而且支持语言的在线切换，三种视频播放器样式供你参考使用
MooTools驱动的HTML5 Audio Player。包含多个模板和皮肤。
Speakker是一个开源并且可定制的HTML5音乐播放器。利用几行JavaScript代码就能够将它集成到任何网页中。
该播放器使用非常灵活，可以改变它的大小、颜色，它还提供两个内建的主题模板。
在使用中，用户可以在两个播放模式中选择 - 迷你或大界面。在大界面模式下，用户可以控制一个播放列表。
该项目使用Projekktor的核心，并提供其它一些功能特性，例如，Flash回放，自定义界面等等。
转载请注明:破洛洛(谢谢合作)
上一篇文章： 下一篇文章：
网友评论：
[][][][][][][][][][]微信浏览器中播放声音的正确姿势及html5中的audio标签
点击上方「Html5跨平台开发」一键关注，更多Html div css
HTML5+CSS3、JavaScript、JQuery，PHP、mysql、帝国CMS建站教程尽在掌握
标榜的正确姿势似乎还是不对。
wx.config({
&// 配置信息
wx.ready(function () {
&media.src = "/project/shake-money/img/shake.mp3"
&media.play();
代码放在一起是可以的，代码分开，或调用别的JS SDK，就不行了。
测试了很久，始终无法实现。想起了以前的WeixinJSBridge，测试了一下，竟然成了。
= document.getElementById("musicBox");
if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
&WeixinJSBridge.invoke('getNetworkType', {}, function (res)
& &// 在这里拿到
e.err_msg, 这里面就包含了所有的网络类型
alert(res.err_msg);
& &media.play();
前端就是这么蛋碎。
===========以上内容日===========
在实际项目中需要在微信浏览器中播放声音。所以学习了一下html5中播放声音的一些相关知识。iOS Safari 不允许自动播放
audio，只能通过用户交互触发。
了解了基本的声音播放的属性和时间，开始写代码，比如html：
style="display:none" id="musicBox"
preload="metadata" controls autoplay="false"&
= document.getElementById("musicBox");
if (!media.src) {
&media.src = "/project/shake-money/img/shake.mp3"
media.play();
在pc浏览器下能正常播放，但是在微信页面中不行。尝试了好多姿势，就是播放不了声音。 想起了微信的JS
SDK，找了一边也没有合适的接口。
实在没有办法了，索性在wx.ready(function ()
{...});中尝试了一下，结果成了！估计是微信浏览器做了一些特殊处理。
wx.config({
&// 配置信息
wx.ready(function () {
&media.src = "/project/shake-money/img/shake.mp3"
&media.play();
&每天分享Html5最顶尖的资讯、教程、干货、随时随地学习WEB开发!
咨询、建议、学习欢迎勾搭
Web前端微信号：Html5--
关注后回复“Html5跨平台开发”
&获取超实用Html5开发入门教程
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。是一个HTML5标签的简易包装。但它不仅在支持HTML5的浏览器上能够轻松调用标签，并在不支持HTML5的浏览器上也能通过Flash作为B计划使用。除此之外，audio.js所提供的界面其实也还不错。&支持情况浏览器：Mobile Safari (iOS 3+)Android (2.2+, w/Flash)Safari (4+)Chrome (7+)Firefox (3+, w/ Flash)Opera (10+, w/ Flash)IE (6, 7, 8, w/ Flash)格式：目前audio.js还只以支持mp3格式为主，但在未来可能会支持ogg。如何使用下载audio.js全部组件，确保audio.js, player-graphics.gif 以及 audiojs.swf都放置于同一文件夹内在你的网页当中包含audio.js： &code&&script src="/audiojs/audio.min.js"&&/script&&/code&使用如下的代码进行初始化： &code&&script&
audiojs.events.ready(function() {
var as = audiojs.createAll();
}); &/script&&/code&现在在页面当中的任意位置你都可以这样了： &code&&audio src="/mp3/juicy.mp3" preload="auto" /&&/code&许可证audio.js目前在MIT协议之下进行许可。这个协议算是非常宽松的协议了。文章来源地址：本文链接：, 转载请保留.
阅读(...) 评论()html5网页在线MP3音乐播放器插件
下载资源()次
阅读次数()次
发布时间：
用法简介：
html5网页在线MP3音乐播放器插件。文件引用：&script&src=&Js/jquery.js&&&/script&
&script&src=&Js/jquery-ui.js&&&/script&
&script&src=&Js/tPlayer.js&&&/script&
相关标签：
网友评论：
一、不得利用本站危害国家安全、泄露国家秘密，不得侵犯国家社会集体的和公民的合法权益，不得利用本站制作、复制和传播不法有害信息！
二、互相尊重，对自己的言论和行为负责。
什么是邮箱订阅？
邮箱订阅是xw素材网为jquery爱好者与web程序员提供一项以邮箱的方式发送最新jquery资源与素材资源的模式，用户只需在左侧填写正确的邮箱用户名与邮箱地址我们将每天推荐最新优质资源到用户邮箱。当然每份邮箱都会有一个取消订阅按钮，当用户点击取消按钮时我们将会停止对用户发送邮箱资源推送。再次感谢大家对xw素材网的支持与关注。2830人阅读
1，下面是一个播放音乐的最简单样例
（controls属性告诉浏览器要有基本播放控件）
原文:HTML5 - 使用&audio&播放音频
&audio src=&hangge.mp3& controls&&/audio&
2，预加载媒体文件
设置preload不同的属性值，可以告诉浏览器应该怎样加载一个媒体文件：
（1）值为auto：让浏览器自动下载整个文件
（2）值为none：让浏览器不必预先下载文件
（3）值为metadata：让浏览器先获取音频文件开头的数据块，从而足以确定一些基本信息（比如音频的总时长）
&!-- 用户点击播放才开始下载 --&
&audio src=&hangge.mp3& controls preload=&none&&&/audio&
3，自动播放
使用autoplay属性可以让浏览器加载完音频文件后立即播放。（如果想用来作为背景音乐的话可以把controls属性去掉）
&audio src=&hangge.mp3& controls autoplay&&/audio&
4，循环播放
使用loop属性让音乐播放结束时，在从头开始播放。
&audio src=&hangge.mp3& controls loop&&/audio&
有时我们需要使用js来控制播放器实现音乐的播放，暂停。或者使用js播放一些音效。
1，通过JavaScript控制页面上的播放器
比如把页面上添加一个&audio&用来播放背景音乐（由于controls属性未设置，我们是看不见播放界面的）
&audio id=&bgMusic&&
&&& &source = src=&hangge.mp3& type=&audio/mp3&&
&&& &source = src=&hangge.ogg& type=&audio/ogg&&
通过pause()和play()方法可以使音乐暂停和继续播放（结合currentTime属性可以实现停止和重新播放）
var audio = document.getElementById(&bgMusic&);
//播放(继续播放)
audio.play();
audio.pause();
audio.pause();
audio.currentTime = 0;
//重新播放
audio.currentTime = 0;
audio.play();
2，也可以动态的创建&audio&元素
var audio = document.createElement(&audio&);
audio.src = &hangge.mp3&;
audio.play();
var audio = new Audio(&hangge.mp3&);
audio.play();
通过canPlayType()方法可以判断浏览器支持的编码方式，从而设置对应的音频文件。
if (audio.canPlayType(&audio/mp3&)) {
&&& audio.src = &hangge.mp3&;
}else if(audio.canPlayType(&audio/ogg&)) {
&&& audio.src = &hangge.ogg&;
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：23580次
排名：千里之外
转载：112篇
(1)(1)(1)(1)(2)(4)(3)(5)(4)(5)(19)(6)(2)(29)(27)(2)(4)(3)