1

我正在使用关于飞行故事的精彩信息来生成鼠标悬停事件的声音，这是数字写作项目的一部分。我目前的草稿一直停止声音，或者在 Chrome 中显示“Aw，Snap”页面。该页面位于http://www.nathan-walker.co.uk/sounding

我还将频道增加到 300 个（这可能是我需要的）。另一个问题是我猜是因为我使用的是 WAV 文件而且它们相当大！如果有人可以提出替代方案或知道某种解决方法，那就太好了！

<audio id="multiaudio1" src="audio/flute_c_long_01.wav" preload="auto"></audio>    
<audio id="multiaudio2" src="audio/piano_chord.wav" preload="auto"></audio>
<audio id="multiaudio3" src="audio/synth_vox.wav" preload="auto"></audio>    
<audio id="multiaudio4" src="audio/shimmer.wav" preload="auto"></audio>
<audio id="multiaudio5" src="audio/sweep.wav" preload="auto"></audio>

<a href="javascript:play_multi_sound('multiaudio1');">Flute</a><br />
<a href="javascript:play_multi_sound('multiaudio2');">Piano Chord</a><br />
<a href="javascript:play_multi_sound('multiaudio3');">Synth Vox</a><br />
<a href="javascript:play_multi_sound('multiaudio4');">Shimmer</a><br />
<a href="javascript:play_multi_sound('multiaudio5');">Sweep</a><br />

<script type="text/javascript">
var channel_max = 10;                                       // number of channels
audiochannels = new Array();
for (a=0;a<channel_max;a++) {                                   // prepare the channels
    audiochannels[a] = new Array();
    audiochannels[a]['channel'] = new Audio();                      // create a new audio object
    audiochannels[a]['finished'] = -1;                          // expected end time for this channel
}
function play_multi_sound(s) {
    for (a=0;a<audiochannels.length;a++) {
        thistime = new Date();
        if (audiochannels[a]['finished'] < thistime.getTime()) {            // is this channel finished?
            audiochannels[a]['finished'] = thistime.getTime() + document.getElementById(s).duration*1000;
            audiochannels[a]['channel'].src = document.getElementById(s).src;
            audiochannels[a]['channel'].load();
            audiochannels[a]['channel'].play();
            break;
        }
    }
}

4

1 回答 1

1

首先，300 个频道对于网络浏览器来说是非常极端的。你可以很容易地让它崩溃。Chrome 设置了大量的虚拟内存分页（大约是我的第二大页面的 4 倍），然后很快就崩溃了。

第二，为什么要使用 wav？我会将它们转换为压缩格式，并让浏览器的播放器即时解压缩，这样您就可以节省空间。

最后，如果可能的话，我会考虑使用 Web Audio API，而不是使用该<audio>元素（仅设计用于简单的媒体播放）——它肯定在当前的 Chrome 和 Safari 版本中。它比<audio>标签更具性能建模，这将是您在这样的实验中寻找的。只要您按照说明操作，它的使用并不难。这是教程的链接：http ://creativejs.com/resources/web-audio-api-getting-started/

于 2013-06-13T20:33:00.953 回答