Переместить под углом, 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); 

В этом случае t он будет равен 45 °.

Чтобы указать другой угол, сначала вычислите cos (α) и sin (α). Косинус определяет, как далеко вы должны идти вправо, а синус - как далеко продвинуться, чтобы сделать расстояние в 1 пиксель под заданным углом. Если вы хотите покрыть 30-кратное расстояние вместо этого, умножьте результаты синуса и косинуса на 30.

Answer 2

Я просто хотел исправить ошибку в отличном примере 32bitkid из лучшего ответа Йогу.

Если Math.PI делится на -180 (вместо 180), это приведет к правильной позиции для div. Угол 90 градусов двигал div вниз, а не вверх.

$(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/