JQuery smooth animation

Question

I have this animation that makes some buttons on screen 'beat'. It works fine exept one thing, the animation is too 'sharp' and not smooth, how can I smooth it?

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

You can set the easing property on the animate options.

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

http://easings.net/

Answer 2

Try this here, animatethis is a function and target element is the id of element and speed is depend on you.. and marginleft is a example, you should try your code.

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);
                      }
                  });
              }
          });
}