Question

I have a script for jQuery/Javascript tabs, that change every 2 seconds, and if you click on one, it will stop changing. Currently, when the tabs is “active” (as in, currently displayed tab) the background-color of contents and boreder-bottom will be the same color as the tab, and when the tab is inactive, it’s border will result in this: border-bottom: 1px black solid;. The script is working great, but the problem is, if I double-click a tab (even if the clicks are delayed by a lot of time), the border will become black, even though the tab is active.
Here is my jsFiddle example:
http://jsfiddle.net/rD6EZ/4/. ALSO, how do I load the first tab faster, because at the moment, I have to wait 2 seconds, so I just added the manual “Loading” tab.

Answer 1

this will fix the black border problem:

    if( typeof prevTab !== 'undefined' && $(element).attr('class')!= $(prevTab).attr('class'))

end for the delay make something like:

    var timer = setInterval(function() {
            if(!klik){
                st %= nrTabs;
                tabChange(tTab.eq(st++));
            }
            else{
                clearInterval(timer);
            }
        }, 2000);
        st %= nrTabs;
        tabChange(tTab.eq(st++)