Question

I’m trying to create a really simple animation that moves along an absolutely positioned div when a button is pressed.

I can get it to jump to a specific value using.

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

But when I try to move it along by an increment it doesn’t move at all.

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

I’ve tried a few things but I can’t seem to get it to work. Any suggestions here would be welcomed.

Answer 1

If .projectImages is selecting just one div, this should work:

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

ParseFloat reads the pixel value for the left position of the current element, but ignores the “px”.