Question

我想沿着弧形路径为图像设置动画。这个圆弧是圆周长的45°。

我了解以前最简单的方法是使用https://github.com/weepy/jquery.path，但此代码似乎已不存在（演示版不再适用于Chrome）。

我将如何处理此事？

Answer 1

您可以在动画中使用step回调来制作自己的自定义效果。为某些没有可见效果的属性设置动画，并设置坐标：

$('div').css({ fontSize: 0 }).animate({
    fontSize: 45
},{
    duration: 2000,
    easing: "swing",
    step: function(t, fx){
        var a = t / 57.296; // from degrees to radians
        var x = 100 + Math.cos(a) * 50;
        var y = 100 + Math.sin(a) * 50;
        $(this).css({ left: x, top: y });
    }
});

演示：http://jsfiddle.net/Guffa/a9eXE/

如何沿弧形动画图像

1 个答案: