我对 javascript 相当陌生,并尝试在 mousemove 上播放随机选择的声音。我无法上班,希望得到帮助。我使用 howler.min.js 来控制声音,因此不会等到声音播放结束才播放下一个声音。这是代码:
var soundObjects = [];
var lastSoundTime = Date.now();
c.addEventListener("mousemove",function(evt){
var mx = evt.clientX - this.offsetLeft;
var my = evt.clientY - this.offsetTop;
//console.log("clicked at x:" + mx + ", y:" + my);
//
circles.push(makeMovingCircle(mx, my));
var now = Date.now();
var elapsed = now - lastSoundTime;
console.log(elapsed);
if (elapsed < 250) {
return
}
lastSoundTime = now;
new Howl({
var sounds = ['splash.mp3',
'splash.ogg',
'splash1.mp3',
'splash1.ogg',
'splash2.mp3',
'splash2.ogg',
'splash3.mp3',
'splash3.ogg',
'splash4.mp3',
'splash4.ogg',
'splash5.mp3',
'splash5.ogg'];
var soundFile = sounds[Math.floor(Math.random()*sounds.length)];
}
}).play();
这里最大的问题是你试图在 Howl 对象内定义变量,但你不能这样做。第二个问题是您只选择了所需的声音文件之一。我还建议您预加载所有可能的声音文件,然后随机播放一个声音文件,而不是每次都创建一个新的 Howl 对象。尝试这个:
var soundObjects = [];
var lastSoundTime = Date.now();
// Preload Howl objects
var sounds = ['splash', 'splash1', 'splash2', 'splash3', 'splash4', 'splash5'];
var howls = {};
for (var i=0; i<sounds.length; i++) {
howls[sounds[i]] = new Howl({
urls: [sounds[i] + '.mp3', sounds[i] + '.ogg']
});
}
c.addEventListener('mousemove', function(evt){
var mx = evt.clientX - this.offsetLeft;
var my = evt.clientY - this.offsetTop;
circles.push(makeMovingCircle(mx, my));
var now = Date.now();
var elapsed = now - lastSoundTime;
console.log(elapsed);
if (elapsed < 250) {
return;
}
lastSoundTime = now;
// Select a random sound and play it
var sounds = ['splash', 'splash1', 'splash2', 'splash3', 'splash4', 'splash5'];
var soundFile = sounds[Math.floor(Math.random() * sounds.length)];
howls[soundFile].play();
}, false);
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)