jqueryjquery-cycle

Jquery Disable Next button until animation finishes

This is cool and I am familiar with this. However I want the next and previous buttons to stay visible, just not be click able. In my particular situation, the buttons are images that are part of the design. I just want the user to not be able to click through before an animation ends.

Solution 
  • $(function(){
    $("#previous").bind("click", Previous);
    $("#next").bind("click", Next);
});

function DoAnimation() {
    $("#previous,#next").unbind("click");
    $('#id').animate(
        complete: function() {
            $(this).after('<div>Animation complete.</div>');
            $("#previous").bind("click", Previous);
            $("#next").bind("click", Next);
        }
    });
}

function Previous() { }
function Next() { }