首页风格
门户
博客

GBin1博客视图 - 最近发布的文章-demo

现代浏览器的web音频javascript类库 - Howler.js

howlerjs

在线演示

浏览器这个玩意儿并不是个新鲜事,但是随着HTML5的发展激起了浏览器技术的巨大发展。但是浏览器上对于音频控制技术来说仍旧非常的落伍。庆幸的是 Google积极的开发和创建了web audio API,这使得基于浏览器的音频控制更加的简单并且直观。但是唯一的问题是浏览器兼容性支持问题!

今天我们将要介绍一款基于web audio API的javascript类库 - howler.js,能够帮助你快速简单全面的控制音频。最早这款JS类库是为web游戏设计开发的。它使用Google的web audio API,如果浏览器不支持的话,会自动fallback到HTML audio。你可以方便的将声音控制整合到你开发的网站,应用或者web游戏中去。如果你需要兼容老版本浏览器需要使用一些fallback,可以参考这篇文章:

跨浏览器的HTML5 Audio解决方案- Audio5js

主要特性

  • 缺省使用Web Audio API
  • 可以方便的fallback回HTML…

标签: howlerjs, javascript, HTML5, audio

阅读更多

使用浏览器生成超棒的midi音乐 - midi.js

使用浏览器生成超棒的midi音乐 - midi.js

还记得前面我们介绍过的WebRTC来控制你的摄像头吗?随着HTML5的发展,越来越多的多媒体相关标准及其实现也随即出现了。

如果你没有尝试过使用javascript来生成midi音乐的话,今天介绍的MIDI.js绝对能够让你眼前一亮。

MIDI.js是一个基于框架帮助你使用浏览器生成MIDI音乐的类库。使用它和jasmid可以用来创建一个在线的web-radio MIDI系统。或者你也可以使用Three.js, Sparks.js, or GLSL来创建一个具有图形动画的动态体验。模仿钢琴或者吉它,打击乐器,MIDI内容来生成你希望生成的效果。推荐使用Google chrome来播放,因为它的时间点是最准确的,当然你也可以使用Safari或者firefox,听起来感觉有点像是演奏家喝多了。

网站地址:http://mudcu.be/midi-js/

标签: html5, midijs, midi, audio

阅读更多

分享一个老式卡带机风格的HTML5 Audio播放器实现

分享一个老式卡带机风格的HTML5 Audio播放器实现

在线演示  本地下载

如果你不知道什么是卡带机的话,恭喜你,你真的非常太年轻,作为八,九十年代播放音乐必备的设备,对于我们这些70,80后的朋友来说会感觉非常情切。那个年代拥有一个sony的随声听绝对是很拉风的一件事情。

在今天我们这篇HTML5文章分享中,我们将要介绍来自tympanus的一个老式卡带机风格的HTML5音频播放器,绝对能够让你重温一下过去的生活方式。相信你会觉得既亲切又震撼,

请大家记住这只是一个实验性质的HTML5实现,可能会有很多bug,但是提供了老式卡带机的几乎所有功能,包括,播放,停止,快进,快退等等,还有最重要的切换磁带A,B面。是不是你都忘记了?希望大家喜欢!

卡带界面来自于Mauricio Estrella的超棒PSD,你可以在这里找到:Cassette - PSD File by Mauricio Estrella

音量旋钮插件来自于:KnobKnob jQuery plugin…

标签: 卡带机, cassette, html5, audio, player, css3, buttons, sounds, vintage, old school, javascript, jquery

阅读更多

喜欢我们的文章请您与朋友分享:

?ü?à

今日推荐