以某個角度移動，jquery，animate（）？

Question

有沒有辦法在使用時指定角度

$(this).animate({'left': '+=30px'}, 1000);

我想要

$(this).animate({'48': '+=30px'}, 1000);

48是角度

Answer 1

您可以指定left和top屬性：

$(this).animate({left: '+=30px', top: '+=30px'}, 1000);

在這種情況下，角度將是45°。

要指定不同的角度，首先計算cos（α）和sin（α）。 cosinus指定你必須向右走多遠，以及鼻竇走多遠，以指定角度形成1個像素的距離。 如果要覆蓋30像素距離，則將竇和余弦結果乘以30。

Answer 2

我只是想糾正一個錯誤的32bitkid的優秀例子來自Yogu的最佳答案。

如果Math.PI除以-180（而不是180），則將得到div的正確位置。 90度角向下移動而不是向上移動。

$(function() {
    var dist = 30;
    var angle = 90;
    var x = Math.cos(angle*Math.PI/-180) * dist;
    var y = Math.sin(angle*Math.PI/-180) * dist;
    $("div").animate({'left': '+='+x+'px', 'top': '+='+y+'px'}, 1000);      
})

這是更新的小提琴： http ： //jsfiddle.net/9yL8hxnz/