Javascript 向滑块添加声音

我有13张照片，我将把它们放在一个滑块中。我希望每个图像都有一个声音，例如，当我看到图像10时，声音10开始播放

我对jQuery完全不熟悉，我曾考虑将其用作滑块，但我不知道如何将声音集成到其中

---

有什么简单的想法吗？

如果您不需要传统浏览器支持，请查看Web Audio API。

下面是一个例子：

像这样的事情应该会奏效

…还有一些框架，可以为您做一些工作。

---

是一个好主意。

自动播放声音是一个非常糟糕的主意。虽然我很同意你的普通网站，但声音在更像应用程序/游戏的环境中仍然很有意义……谢谢！它可以工作，但我的问题是，我需要在每个不同的图像上使用不同的声音。您只需在回调函数中定义当前幻灯片并触发匹配的声音。。。（不知道orbit，但对于jQuery cycle，这是作为参数传递给回调函数的）我不知道，我在orbit中看不到此选项。

//call the init function on window load
window.onload = init;
var context;
var bufferLoader;
//create 2 audio sources... as there were 2 in the example linked above
var source1 = context.createBufferSource();
var source2 = context.createBufferSource();

function init() {
  //initialise the audio context
  context = new webkitAudioContext();

  //init preloading of sounds
  bufferLoader = new BufferLoader(
    context,
    [
      '../sounds/br-jam-loop.wav',
      '../sounds/laughter.wav',
    ],
    finishedLoading  // <- callback function when finished loading
    );

  bufferLoader.load();
}

function finishedLoading(bufferList) {
  //set the buffers of the sources from the loaded bufferlist
  source1.buffer = bufferList[0];
  source2.buffer = bufferList[1];

  //connect the sources to the output
  source1.connect(context.destination);
  source2.connect(context.destination);
}

$('#featured').orbit({
     afterSlideChange: function(){
       source1.noteOn(0);
       source2.noteOn(0);
     }
});