javascript - 利用HTML5/JS有没有办法实现快速循环播放
PHPz
PHPz 2017-04-10 12:48:47
0
3
662

最近需要做一个WEB应用。里面有一个场景是转盘抽奖,想做点声音上去,在转盘转动的时候播放,音频文件很简单,就是“哒”的一声,大小也只有6K,已知HTML5有

<audio src="sfx_lottery_spinclick.mp3" autoplay loop></audio>

但是速度明显不够,一秒钟大概能播放5次,怎么样才能让他播放的频次更高呢?配合JS以编程的方式来实现会不会有办法呢,请高手赐教。。。

PHPz
PHPz

学习是最好的投资!

membalas semua(3)
数据分析师

javascript - Adakah terdapat cara untuk mencapai main balik gelung pantas menggunakan HTML5/JS - Soal Jawab tapak web PHP Cina - javascript - Adakah terdapat cara untuk mencapai main balik gelung pantas menggunakan HTML5/JS - Soal Jawab tapak web PHP Cina

Lihat sekeliling dan pelajari .

左手右手慢动作

<audio>的接口里有声音播放速度的接口,但是多浏览器支持没有做过测试,楼主小心使用。

myVid=document.getElementsByTag("audio");
myVid.playbackRate=4;//大于1,就是高速播放

当然,如果是声音里面有衰减或空白的部分,不想剪辑声音的话,可以用多个Audio同时循环播放,如下:

var audios=[];
for (var i= 0; i < 5; i++ ) {
    var a = new Audio();
    a.src = "" ;//填入你的音频地址
    a.preload="auto";
    a.loop = true;
    audios.push(a) ;
}

// 调用下面函数之前需要先确定audio已经完全载入,可以通过audio的readystate接口进行判断。
//这里直接就写成立即执行的方式了。
(function playSingle(i){
    //用递归写的,迭代也可行
    if ( i > 0 ) {
        audios[i-1].play() ;
        setTimeout(function(){
            playSingle(i-1) ;
        },1000);//每隔1000毫秒,额外播放一个音频
    }
})(audios.length) ;

最后共五个音频先后循环播放,各延迟1000毫秒。当然可以通过调节毫秒数来达到更好的效果。

Ty80

我推测你的问题在于比如音频可能有100ms,但你想1000ms内播放100次。所以单纯的遍历是不能解决问题的,而且在极快的情况下,js所需要的时间也会被考虑进去延缓频率。

可以试试多开几个音频,然后延时播放。比如说在10ms时播放第二个音频,20ms播放第三个...90ms播放最后一个,这样在100ms时第一个音频会再次循环,如此就可以达到10ms播放一次的频率。

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan