jQuery Animation:如何沿指定的弧/贝塞尔曲线移动?

时间:2013-02-04 08:28:03

标签: jquery jquery-animate

我检查了jQuery Path plugin,并尝试按照路径设置DIV动画。我成功地使DIV沿着路径移动,但我希望DIV根据路径方向前进(沿着beizer路径旋转)。我该怎么办?

这是我目前的代码:

$('#car001').click(function() {
    var bezier_params = {
        start: { 
          x: 185, 
          y: 385, 
          angle: 50
        },  
        end: { 
          x:540,
          y:110, 
          angle: -10, 
          length: 0.25
        }
      }
      $("#car001").animate({path : new $.path.bezier(bezier_params)}, 1000);
});

$('#car001')仅包含1张图片。

1 个答案:

答案 0 :(得分:0)

看起来jquery.path应该使用its call to atan2

如果您切换到https://github.com/heygrady/curvea blog post with working jsfiddle demos也可以提供更好的服务。

我确信还有很多其他选择。如果您不依赖于HTML DOM,您还可以尝试the many SVG libraries out there之一。