大家都知道,HTML5 Audio标签能够支持wav, webm, mp3, ogg, acc等格式,但是有个很重要的音乐文件格式midi(扩展名mid)却在各大浏览器中都没有内置的支持,因为mid文件并不像其他声音文件那样记录声音的采样信息,而是记录了乐器的演奏指令,二者的原理截然不同。 mid文件格式的最突出的有点是文件极小,几分钟的音乐可能只

  

  大家都知道,HTML5 Audio标签能够支持wav, webm, mp3, ogg, acc等格式,但是有个很重要的音乐文件格式midi(扩展名mid)却在各大浏览器中都没有内置的支持,因为mid文件并不像其他声音文件那样记录声音的采样信息,而是记录了乐器的演奏指令,二者的原理截然不同。

  mid文件格式的最突出的有点是文件极小,几分钟的音乐可能只有几K的文件大小,mp3等其他格式则至少要几M以上,所以midi在手机和web上有很大的优势,特别是适合做各种铃声,背景音乐。

  标签已经过时了,很多浏览器都不再支持。

  无论是标准组织,还是浏览器厂商,都主张使用来播放音频文件。

  考虑到要求支持MIDI的广泛呼声,W3C有指定了一个Web MIDI API草案,但这个草案还非常新,浏览器还没有支持。

  为了让midi在html5 audio上播放出来,需要动用Javascript 来处理。

  我这里推荐3个非常好的Javascript实现的audio播放midi:

  MIDI.js - Sequencing in Javascript.

  这是一个js库,封装了一些接口方便web开发者调用播放mid音乐文件。

  

  Color Piano V2

  这是一个彩色钢琴,你可以手动弹奏,也可以自动弹奏动态加载的mid文件。

  

  Audiotool

  这是一个强大的电子音乐合成工具了,没有一点器乐知识的话,可能基本不懂用了,比如我。

  

  本文来自cuixiping的博客,原文地址:http://blog.csdn.net/cuixiping/article/details/7826138

   

HTML5 Audio时代的MIDI音乐文件播放的更多相关文章

  1. Three.js + HTML5 Audio API 打造3D音乐频谱,Let’s ROCK!

    继续玩味之前写的音乐频谱作品,将原来在Canvas标签上的 作图利用Three.js让它通过WebGL呈现,这样就打造出了一个全立体感的频谱效果了. 项目详情及源码 项目GitHub地址:https: ...

  2. ios加载html5 audio标签用js无法自动播放

    html5 audio标签在ios 微信浏览器中是无法自动播放的,最近在做一个小的项目遇到这个问题,安卓和pc都是正常的,唯独ios不行,查阅了很多资料,找到了以下方法,也许不是最好用的方法,如果有更 ...

  3. iOS开发--音乐文件播放工具类的封装(包含了音效的封装)

    一.头文件 #import <Foundation/Foundation.h> #import <AVFoundation/AVFoundation.h> @interface ...

  4. 在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. MUI音乐播放html5+audio模块

    html5+ audio 模块MUI播放音频 Audio模块用于提供音频的录制和播放功能,可调用系统的麦克风设备进行录音操作,也可调用系统的扬声器设备播放音频文件.通过plus.audio获取音频管理 ...

  6. CEF3 HTML5 audio标签为什么不能播放mp3格式的音频文件

    CEF3 HTML5 audio标签 为什么不能播放mp3格式的音频文件   原因略.   解决方法: 找一个最新版的chrome ,我用的是24版本.路径 C:\Documents and Sett ...

  7. HTML5 audio标签自制音乐播放器

    相关技能 HTML5+CSS3(实现页面布局和动态效果) Iconfont(使用矢量图标库添加播放器相关图标) LESS (动态CSS编写) jQuery(快速编写js脚本) gulp+webpack ...

  8. html5 audio标签微信部分苹果手机不能自动播放音乐终极解决方案

    html5 audio标签微信部分苹果手机不能自动播放音乐终极解决方案 大家都知道需要在点击时候后 播放 ps:如果点击ajax 回来播放也不行,必须点击立即播放 要背景自动播放只能采取下面方案< ...

  9. html5 audio标签切换播放音乐的方法

    html5 audio标签切换播放音乐的方法<pre><audio id="music1" preload loop="loop">&l ...

随机推荐

  1. SQL Server索引的维护 - 索引碎片、填充因子 <第三篇>

    实际上,索引的维护主要包括以下两个方面: 页拆分 碎片 这两个问题都和页密度有关,虽然两者的表现形式在本质上有所区别,但是故障排除工具是一样的,因为处理是相同的. 对于非常小的表(比64KB小得多), ...

  2. css案例学习之span边框实现的特殊效果

    bottom left bottom right top left top right 配合颜色来使用,实现一些神奇的效果 #menu a span{ height:; width:; /*borde ...

  3. MongoDB appendix

    mongo 是数据库shell.一般假定它和mongod 运行在同一台机器上,还假定mongod 绑定了默认端口. eg.  mongo  staging.example.com:20000,这样就会 ...

  4. Oracle学习笔记(2)——过程和函数

    过程和函数统称为PL/SQL子程序,通过输入.输出参数或输入/输出参数与其调用者交换信息.他们是被命名的PL/SQL块,被编译后存储在数据库中,以备执行.因此,可以在数据库中直接按名称使用它们. 1. ...

  5. andorid 控件 Bootstrap3.0风格的控件 精美UI控件库

    Bootstrap是Twitter推出的一个开源的用于前端开发的工具包.它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架.Bootstra ...

  6. 第五章 Logistic回归

    第五章 Logistic回归 假设现在有一些数据点,我们利用一条直线对这些点进行拟合(该线称为最佳拟合直线),这个拟合过程就称作回归. 为了实现Logistic回归分类器,我们可以在每个特征上都乘以一 ...

  7. 解析Xml四种方法

    关键字:Java解析xml.解析xml四种方法.DOM.SAX.JDOM.DOM4j.XPath [引言] 目前在Java中用于解析XML的技术很多,主流的有DOM.SAX.JDOM.DOM4j,下文 ...

  8. IT运维外包甩不掉的包袱

    对一个企业的IT信息部门来说,保证IT系统的安全.稳定和可靠运行是IT部门义不容辞的职责,但IT系统的安全.稳定和可靠是相对的,得看企业IT投入和ROI.现在企业的IT系统运维面临着多重压力:一方面是 ...

  9. iOS基本内存管理:autorelease和autoreleasepool

    1.autorelease 基本用法 对象执行autorelease方法时会将对象添加到自动释放池中 当自动释放池销毁时自动释放池中所有对象作release操作 对象执行autorelease方法后自 ...

  10. JavaScript 原型链的一点想法

    JavaScript借鉴了许多语言的特点:例如语法类Java.函数借鉴Scheme.原型继承借鉴自Self.正则表达式借鉴于Perl.(DC Javascript:语言精粹).      首先,每个J ...