语境
我在网页的背景中播放HTML音频，该音频具有淡入/淡入功能，该功能使用jQuery .animate函数在淡出时将音量设置为0，在淡入时将音量设置为1。
我已经实现了页面可见性API：https : //developer.mozilla.org/en-US/docs/Web/Guide/User_experience/Using_the_Page_Visibility_API
这用于检测用户是否切换选项卡。
目前，我有淡出功能调用上的音频，当标签从可见变为隐藏和功能褪色从隐藏到可见的打算时，被称为：
fadeOut(id){
$(id).animate({volume: 0}, 1000});
}
fadeIn(id){
$(id).animate({volume: 1}, 1000});
}
问题
切换选项卡时，从可见到隐藏，将调用fadeOut函数，而不是从音量1慢慢变到0，而是在1秒钟后直接变为0，但是当它从隐藏变为可见时，它按预期执行，从从0到1缓慢。我尝试过切换功能，似乎只有在从可见到隐藏时才会发生。这是jQuery .animate函数的实现功能吗？还是我错过了什么？
每个步骤的控制台日志输出
从隐藏到可见时：
“步进时间：“ 0”音量：“ 0
“步进时间：“ 42”音量：“ 0
“步进时间：“ 44”音量：“ 0.025049273427930594
“步进时间：“ 51”音量：“ 0.026579017009366445
“步进时间：“ 60”音量：“ 0.030591727271815305
...
“步进时间：“ 1000” vol：“ 1
从可见到隐藏
“步进时间：“ 1000” vol：“ 1
“步进时间：“ 0”音量：“ 0
我发现这是'.animate'函数执行的优化问题。当页面被“隐藏”时-您正在查看另一个选项卡-jQuery将跳过动画步骤，因为查看器实际上无法看到动画。这对于实际的动画非常有用，但是在这种情况下，使用声音时，它会从1跳到0，并跳过它们之间的步骤。
我在API中找不到提到的内容，这有点令人讨厌。
我当前的解决方案是创建自己的“动画”功能，以递归setTimeout循环降低声音级别。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句