Question

$("#rightControl").click(function(){
    $("#thumb_menu").animate({"left": "-=520px"}, "slow");
    var pos = $('#thumb_menu').position();
    if(pos.left < 0) { 
        $('#header')
            .prepend('<span class="control" id="leftControl">Move left</span>')
}
});

Clicking #rightControl once moves #thumb_menu to -450px left so the if should run but I cant seem to get this working.

Where am I going wrong?

Answer 1

Place it in a callback to the .animate() so that it has a chance to change its position before the .position() method is invoked..

$("#rightControl").click(function () {
    $("#thumb_menu").animate({
        "left": "-=520px"
    }, "slow", function() {
        var pos = $(this).position();
        if (pos.left < 0) {
            $('#header').prepend('<span class="control" id="leftControl">Move left</span>')
        }
    });
});

Although if you know it is moving to a negative position, I wouldn’t think you’d need the if() statement at all. Just do the .prepend() in the callback.