Jquery Chrome：只有在某些过渡效果期间才会出现奇怪的滚动条

我正在使用jquery对我的全屏背景图像应用以下效果：

function moveDown(){
    $('body').find('img').delay($delay*1000).animate({top: "+="+$distance}, $seconds*1000,'swing')
}
function zoomOut(){
    $('body').find('img').css({"transition":"all 6s linear","transform":"scale(1)"});
}
function zoomIn(){
    $('body').find('img').delay($delay*1000).animate(obj,6500,'linear');
}

这很好，但只有在第二个功能zoomOut的情况下，我只在Chrome中遇到了一个问题。在执行转换时，我在正常滚动条旁边看到一个奇怪的滚动条，只有在进行转换时才会显示这个滚动条。正如你在这张图片上看到的

在过渡之后，它再次消失，在过渡期间它再次出现

---

有人知道如何摆脱第二个滚动条吗？

这里有两件事我首先会怀疑

您正在使用基于javascript的动画进行向下移动和缩放，但在zoomOut上设置CSS动画值。尽量与动画保持一致，尽可能使用CSS动画，因为与javascript动画相比，CSS动画的性能更好，例如使用硬件加速等

当您设置CSS转换值时，当另一个动画触发时，它不会被取消应用，这意味着在moveDown或zoomIn中进行的每个增量更改都将应用六秒钟的转换

如果您想要快速而肮脏的修复，您可以在zoomIn和moveDown中放置以下块：

$('body img').css({'transition':'none', 'transform':'none'});

但理想情况下，您可以将所有这些CSS转换包装在一个类中，然后通过JavaScript应用该类

---

只有我的2¢

代码有助于诊断此问题，即受影响对象上的CSS。没有受影响对象，只有全屏幕bg图像是bg图像实际的背景图像还是延伸到页面宽度和高度的img标记？？关于动画的一致使用，您肯定是正确的，并且会这样做。但建议的修复方案似乎不是第二个出现的滚动条的解决方案。。。