How to disable/enable nav buttons in cycle plugin?

Question

I'm using cycle plugin for sliding contents. When I click on prev or next buttons more than one time while sliding, it just jumps to another slide before the animation is complete.

I'm trying to disable nav buttons while sliding but it's not working.

js:

$('#slider ul').cycle({
    timeout: 0,
    fx: 'scrollHorz',
    prev: '#prev',
    next: '#next',
    after: onAfter,
    onPrevNextEvent: function(isNext, zeroBasedSlideIndex, slideElement){
        $('#nav a').attr('disabled','disabled');
        if (isNext == true || isNext == false) {
            console.log('bool')
        }
    }
});
function onAfter(curr, next, opts) {
    var index = opts.currSlide;
    $('#prev')[index == 0 ? 'hide' : 'show']();
    $('#next')[index == opts.slideCount - 1 ? 'hide' : 'show']();
}

I'm using the callback onPrevNextEvent to check if isNext is boolean. Before this condition I made a test to add attribute on the nav links, it's adding the attribute but it's not preventing the prev/next function. How can I disable/enable it? Some help would be appreciated

Answer 1

You can't change the click behavior in the plugin's code? Maybe shortly after cycle plugin has been initialized, you could throw an extra event on to prevent propagation. That way, if isNext is true, it will stop the click event from triggering the plugin's action.

Something like:

//just finished setting up the plugin
$("#prev,#next").on("click", function(e) {
    if(isNext) e.stopPropagation();
});