javascript - Need onclick to go full distance before click works again

Question

I have this javascript function I use that when clicked goes a certain distance. This is used within a scroller going left to right that uses about 7 divs. My question is ho

Answer 1

I second BYossarian's answer.

Here is a variation on his demo, which "skips" the animation when the user clicks several times quickly on the buttons :

$(function () {

    var targetScroll = 0,
        outerwrap = $(".outerwrapper");

    $("#right, #left").click(function () {
        // stop the animation,
        outerwrap.stop();
        // hard set scrollLeft to its target position
        outerwrap.scrollLeft(targetScroll*251);

        if (this.id === "right"){
            if (targetScroll < 6) targetScroll += 1;
            dir = '+=251';
        } else {
            if (targetScroll > 0) targetScroll -=1;
            dir = '-=251';
        }
        outerwrap.animate({ scrollLeft: dir }, 1000);
    });

});

fiddle