jQuery Tools tabs auto rotate (done) and pause on hover (done) resume on mouseout NEED HELP!

2.2k Views Asked by At

I can get the tabs to auto rotate, and pause on hover, but can't seem to get them started again when you mouse out. Also, is "fadeInSpeed" done correctly? the Please take a look and see if you can help, it's much appreciated! Really glad to see jQueryTools doing well again!

$(function() {
    var rotateDelay = 3500;
    var rotateTabs=true;
    var $tabItems = $('#flowtabs li a').hover(function(){
    rotateTabs=false;
});

var tabs = $("ul#flowtabs").tabs('#flowpanes > div', {api:true, effect:'fade', fadeInSpeed: 100, rotate: true});

function doRotateTabs(){
    if (rotateTabs) {
        setTimeout(function(){
            if (!rotateTabs) return;
            if(tabs.getIndex() == $tabItems.length-1){
                tabs.click(0);
    }
    else {
        tabs.next();
    }
    doRotateTabs();
    }, rotateDelay);
  }
}
doRotateTabs();
});
1

There are 1 best solutions below

0
On

Did you ever solve this problem

Why are you writing your own code to make it auto play I just passed the configuration for sideshow and it works. It seems to be pausing on mouse over and works like a charm.

My code is below

$(function() {
$(".slidetabs").tabs(".images > div", {

// enable "cross-fading" effect

effect: 'fade',
fadeOutSpeed: "slow",

// start from the beginning after the last tab
rotate: true

// use the slideshow plugin. It accepts its own configuration
}).slideshow({

    autoplay: 'true'

    });


});

I hope this helps Adity Bajaj