jQuery перемещает абсолютно позиционированный div с шагом

Question

Я пытаюсь создать действительно простую анимацию, которая перемещается по абсолютно позиционированному элементу div при нажатии кнопки.

Я могу заставить его перейти к определенному значению, используя.

    $("#rightArrow").click(function() {
    $(".projectImages").css(
        "left", '200px'
        );
});

Но когда я пытаюсь продвинуть его с шагом, он совсем не движется.

$("#rightArrow").click(function() {
    $(".projectImages").css(
        "left", '+=200px'
        );
});

Я попробовал несколько вещей, но я не могу заставить его работать. Любые предложения здесь будут приветствоваться.

Answer 1

Я думаю, что значение приращения можно использовать только с помощью метода "animate".Из описания (http://api.jquery.com/animate/):

Анимированные свойства также могут быть относительными. Если значение снабжено лидирующей + = или - = последовательностью символов, то целевое значение вычисляетсяпутем добавления или вычитания заданного числа из текущего значения свойства.

В описании метода "css" нет упоминания об относительном значении.

Answer 2

Если .projectImages выбирает только один div, это должно работать:

$("#rightArrow").click(function() {        
    $(".projectImages").css(
        "left", (parseFloat($(this).css("left")) + 200) + 'px');
        );
});

ParseFloat читает значение в пикселях для левой позиции текущего элемента, но игнорирует «px».