如何用javascript实现流畅的音乐转换

Question

我想在网页上从一首歌淡入另一首歌。这是一个说明问题的codepen：

music transition test

我可以使用此代码实现音乐音量淡化：

$("#mysong").animate({volume: 0}, 1000);

但是在淡出完成之前歌曲会切换。我怀疑这一行

mysong.play();

正在触发要播放的新歌，但如果我省略该行，则新歌不会启动。

我在更改源代码之前尝试过这个：

while (mysong.volume != 0)

但它有奇怪的行为。第一次单击转换按钮时，音乐将停止，最终下一首歌曲将淡入。再次按下转场只会淡化音量，不再更改音源。

Answer 1

animate方法有一个接受函数的完整参数。动画完成后将调用此函数。查看documentation。

$("#mysong").animate({volume: 0}, 1000, function() {
     //Your code here.
});