javascript - jQuery找到合适的缓动功能

大家好，我试图用html和JQuery创建加载动画，看起来像Windows Phone 7加载动画。
我已经走了这么远

http://jsfiddle.net/b6L8M/5/

但是缓动功能与我想要的功能相反，我希望它在边缘时能快速移动，而在其中心时则放慢速度。

当查看http://jqueryui.com/demos/effect/easing.html时，似乎没有为此的内置函数，那么我将如何创建该函数？

最佳答案

如果将动画分为两部分，则可以ease-in到中心和ease-out中心：

function moveDot(dotItem, delay) {
    var dotItem = $(dotItem);
    dotItem.delay(delay * 200).css('left', '0%').animate({left: '50%'}, 1000, 'easeOutCirc',  function() {
        dotItem.animate({left : '100%'}, 1000, 'easeInCirc', function () {
            moveDot(dotItem[0], 0);
        });
    });
}

我还缓存了$(dotItem)选择，因此在创建另一个选择时它不会造成打mid的中间动画（这种情况发生的可能性不大，但是::）。

这是一个演示：http://jsfiddle.net/b6L8M/13/