Jquery slider previous and next weird on double click

Question

I am creating a simple accordion using jQuery, so far it looks good but it acts weird on double click or even if clicked more then twice. Instead of just closing itself it starts opening and closing depending how many times been clicked. Thought about implementing a variable, something like if(!hasbeenclicked) but not sure if that would work. So basically I wonder how to prevent it from double clicks an if clicked again on the same option, just close itself.`sliderClass : "scrollable", prevbutton : 'previous', nextbutton : 'next', duration : 5000, slideCount : 3, prevText : 'Previous', nextText : 'Next', clickTiming : 5000,

initSlider : function(sliderObject, direction, eventType) {

    slideCount = this.slideCount;
    slideWidth = sliderObject.find('li:first-child').outerWidth(true);


    var lefVal = slideWidth * slideCount;


    if (direction == 'moveLeft')
        lefVal = -lefVal;


    if (sliderObject.attr("class").indexOf("autoScroll") >= 0) {
        var all_classes = sliderObject.attr("class");
        if (all_classes.length > 1) {
            var auto_scroll_time = all_classes.match(/\d+/)[0];
            auto_scroll_time = parseInt(auto_scroll_time.split("autoScroll").join(""));
            interval_duration = auto_scroll_time * this.duration;

        }
    }

    function slideAnimate() {
        if (eventType == 1)
            var animateTime = this.duration;
        else
            var animateTime = this.duration;

        sliderObject.animate({
            left : lefVal
        }, this.duration, function() {

            var counter = 0;
            sliderObject.children().each(function() {

                if (counter < slideCount) {
                    $(this).appendTo(sliderObject);

                }
                counter++;
            });

            sliderObject.css('left', '');
        });
    }

    if (eventType == 1) {

        setInterval(function() {
            slideAnimate()
        }, interval_duration);
    } else
        slideAnimate();
    // When called from normal click

},
init : function() {


    $('.' + this.prevbutton).live('click', function() {
        customSlider.initSlider($(this).prev(), 'moveRight', 2);
        $(this).unbind("click");

    });
    /**
     *Intialize next click
     */
    $('.' + this.nextbutton).live('click', function() {
        customSlider.initSlider($(this).prev().prev(), 'moveLeft', 2);

    });


    $('.' + this.sliderClass).each(function() {

        customSlider.initSlider($(this), 'moveLeft', 1);

    })
}

};

jQuery(document).ready(function($) {

customSlider.init();

});`

Answer 1

I added a boolean property to your customSlider object called sliding . This gets set true/false based on whether or not the slider is currently sliding, thus preventing those double/triple-click slides.

http://jsfiddle.net/wT8FX/1/

I hope that helps you!