javascript - jQuery平滑动画

Question

我有这个动画可以让屏幕上的一些按钮“节拍”。它工作得很好，除了一件事，动画太“尖锐”而且不流畅，我怎样才能平滑它？

function myFunction() {
    setInterval(function () {
        tstFnc();
    }, 1000);
}

var flag = true;

function tstFnc() {
    var numM = Math.floor((Math.random() * 10) + 1);
    var stringM = '#mgf_main' + numM + ' img';

    $(stringM).animate({
        width: '80px',
        height: '80px'
    }, 150, function () {
        $(stringM).animate({
            width: '68px',
            height: '68px'
        }, 150, function () {
            // nothing
        });
    });
};

Answer 1

您可以在动画选项上设置缓动属性。

http://api.jquery.com/animate/

http://easings.net/

Answer 2

在这里试试这个，animatethis 是一个函数，目标元素是元素的 id，速度取决于你。marginleft 是一个例子，你应该试试你的代码。

function animatethis(targetElement, speed) {
    $(targetElement).animate({ width: "+=10px", height: "+=10px"},
          {
              duration: speed,
              complete: function () {
                  targetElement.animate({width: "+=10px", height: "+=10px" },
                  {
                      duration: speed,
                      complete: function () {
                          animatethis(targetElement, speed);
                      }
                  });
              }
          });
}