每隔几秒就为播放的动画添加声音

时间:2012-12-20 12:54:03

标签: javascript jquery html5 css3

我下面有这个钟,每隔几秒便有一次动画。

演示
http://inspectelement.com/demos/css3/bell

代码
http://inspectelement.com/tutorials/ring-a-bell-with-css-keyframe-animations

我想添加一个铃声,我希望每次动画开始时都能播放声音。

1 个答案:

答案 0 :(得分:0)

试试这个:

var soundFile = 'sound.wav';
playSound(soundFile);
setInterval(function () {
    playSound(soundFile);
}, 8000);

function playSound(audio) {
    var soundElement = '<audio style="display:none; width: 0px; height: 0px;" id="audioNotifier" src="' + audio + '" controls preload="auto" autobuffer></audio>';
    $('#audioContainer').html(soundElement);
    $('#audioNotifier')[0].play();
}

首先超时。每8秒调用playSound函数。 playSound在音频容器中设置HTML5音频播放器并播放音频。音频容器只是一个DOM元素,没什么特别的。声音文件的url应作为参数传递给playSound