Jquery Cycle Slider - Quick Clicks Break Slider

Question

I've created somewhat of a complicated slider with jquery Cycle. You can see it running perfectly here

However, when you click it a bunch of times (before the slide has finished its transition), it starts to go wacky and even hides the text..

Here is my code:

$('#dmzSlideHolder').cycle({
    fx:        'uncover',
     pager:  '#slideNav',
     timeout: '8000',
     before: function() {
        var dmzTitle = $('.dmzSlideTitle p', this).html() + '<span class="arrow">&raquo;</span>';
        $('#slideTitle').stop().animate({width: 1}, 1000);
        $('#slideTitle p').stop().html(dmzTitle).hide().delay(2000).slideDown();
     },

     after: function() {
        var dmzTitle = $('.dmzSlideTitle', this);
        $('#slideTitle').stop().animate({width: 575}, 1000);
     },

});

Any ideas? I thought .stop() would remedy this, but it didnt..

Answer 1

Figured it out. Had to set the .slideUp and .slidedown to happen on the callback of .animate()