jquery animate or ease scroll left increment

Question

$(document).ready(function(){
    $("#right_arrow").click(function(e) {
        var scrollleftvar = $(window).scrollLeft();
        e.preventDefault()
        $("body").scrollLeft(scrollleftvar + 50);
    });
});

Hi, Im trying to animate or ease the incremental scroll eleft triggered above, but struggling a little, any help would be really appreciated, thank you

Answer 1

You can use the .animate()-function:

$('body').animate( { scrollLeft: '+=50' }, 1000, 'easeOutQuad' );

• The first parameter sets the value you want to animate. You can use something like +=value or -=value to animate from the current value (like an offset).
• The second parameter is the time the animation is running.
• And the third is the easing, if you're using an easing plug-in.

See the jQuery-Docs: ".animate()" for more informations.