jquery - JQuery Animate（增加img的宽度）平滑

Question

所以我试图为横幅图像创建一个非常缓慢的放大和缩小效果

效果有效，但动画非常不稳定。有没有办法让效果更流畅？默认情况下，Img 为 1000 像素，因此 zoomIn 函数的大小增加了 30%。在 50000 毫秒时它相当平滑，但为了达到预期的效果（不会让页面内容的查看者分心），我希望它是 100000-200000 毫秒。

感谢您的任何帮助，您可以提供！

  $bannerImg = $('img');

  function zoomIn(){
    $bannerImg.animate({
      width: '+=300',
      }, 100000,'linear');
    $bannerImg.promise().done(zoomOut);
  }

  function zoomOut(){
    $bannerImg.animate({
      width: '-=300',
      }, 100000,'linear');
    $bannerImg.promise().done(zoomIn);
  }

  zoomIn();

Answer 1

你可以很容易地为你的 JS 动画添加缓动，它会让所有的动画变得更加流畅。在这里查看一个示例：jQuery Easing