Anyway to start animate smoothly?

Question

So, instead of using a plugin I wanted to just make a basic marquee. Fair enough. Easy enough. Works decent. The only thing that bugs me is the way the animate starts a little slow and then speeds up. Is there anyway to get a solid speed out of the animate function? With the slow down at the beginning it's no very fluid.

var marquee = $('#marquee'),
    marqueeText = marquee.find('span:first'),
    marqPos = marquee.position(),
    marqTextPos = marqueeText.position(),

    runMarquee = setTimeout(startMarquee, 1000);

function startMarquee() {
    marqueeText.css('left', (marqPos.left - marqueeText.width() - 8)).animate({
        'left': (marqPos.left + marquee.width() + marqueeText.width() + 8)
    }, {
        duration: 5000,
        complete: function () {
            startMarquee();
        }
    });
}

Update

As adeneo pointed out below, adding easing to my animate with the setting linear for linear movement will remedy the problem. I also do not need a timeout as it already is a loop. See updated fiddle.

JSFiddle Demo

Answer 1

Add a linear easing (the default is swing)

easing: 'linear'

FIDDLE