js音频可视化插件Wavesurfer.js

所属分类:媒体-音频和视频

 12208  42  查看评论 (12)
js音频可视化插件Wavesurfer.js ie兼容10

注:本地预览请用火狐浏览器,chrome浏览器需要在服务端运行

利用 wavesurfer.js 你可以创建漂亮的 HTML5 音乐播放器或一个复杂的DJ应用。

使用方法

选择一个容器:

<divid="waveform"></div>

创建一个实例,通过容器的选择选项:

var wavesurfer = WaveSurfer.create({
    container: '#waveform',
    waveColor: 'violet',
    progressColor: 'purple'
});

订阅一些事件:

wavesurfer.on('ready', function () {
    wavesurfer.play();
});

从一个URL加载音频文件:

wavesurfer.load('example/media/demo.wav');
相关插件-音频和视频

jQuery音乐播放插件jPlayer

简洁的音乐插件jPlayer
  音频和视频
 16000  60

交互式的唱机

实验模板与一个交互式的老唱机的网络音频API。
  音频和视频
 12932  121

1:1模仿虾米音乐播放器,歌词与播放进度同步

能够很好地对歌词进行同步,1:1模仿虾米音乐播放器,希望有兴趣的朋友能够相互支持。
  音频和视频
 21555  157

蓝色音乐播放器

网页上的一款网页上的一款音乐播放器!
  音频和视频
 20153  113

讨论这个项目(12)回答他人问题或分享插件使用方法奖励jQ币

    月光倾泻未必凄凉 0
    2018/4/18 10:03:07
    动态添加路径报TeacherSayPlay.html:1 Uncaught (in promise) DOMException: Unable to decode audio data这个错怎么解决啊? 回复
    tzn520ywj 0
    2018/4/4 16:06:06
    没有jq币怎么下载? 回复
    ?米米-? 0
    2018/3/23 2:57:26
    请问为什么使用的时候一直提示WaveSurfer is not defined呢? 回复
    BLANK 0
    2018/1/14 14:46:15
    蕞怕想起? 0
    2017/12/29 10:40:45

    这个怎么在谷歌里面跑不起来啊

    回复
    风起云涌 0
    2017/8/10 14:41:23

    还是看不懂啊

        镪Sんī小秦0
        2017/11/23 13:48:45

        反复看

        千飞下0
        2017/12/1 16:34:13

        qq

    回复
    * 肤浅 ┵§?? 0
    2017/7/12 18:01:35

    确实是JPlayer获取不了音波

    回复
    木木 0
    2017/1/14 0:57:13

    这个不错,下载了,不过现在好像一般都是用的JPlayer吧

    回复
    SiriBen 0
    2017/1/11 10:01:14

    这个不错,下载了,不过现在好像一般都是用的JPlayer吧

        microsoftvs0
        2017/1/14 1:29:54

        JPlayer获取不了音波

    回复
取消回复