Have a little problem with jQuery tools Tabs – Education Career Blog

I use this script to enable tabs.

$(function() {
    // setup ul.tabs to work as tabs for each div directly under div.panes
    $("ul.tabs").tabs("div.panes > div.theme-wrap", {
    effect: 'fade',
    //fadeInSpeed: 200,
    fadeOutSpeed: 400,
    rotate: true
    }).slideshow({autoplay: true, interval: 5000});
});

The problem is that.. I want the PARENT div (.theme-wrap) inside panes to rotate only. Because theme-wrap contains DIVs itself. Problem is that when i click anywhere in the .theme-wrap DIV the tab is switched .. but I want to disable that.

Even the demo:
http://flowplayer.org/tools/demos/tabs/slideshow.htm

It rotates when you click anywhere on the slideshow element. I want to disable that behaviour please because I have clickable links inside each slideshow element and I want rotation to be applied only with “autoplay” if the mouse is outside the slideshow container.

Is that possible?

Thank you very much.

,

The answer was in the documentation for the slideshow:

$(function() {
    $("ul.tabs").tabs("div.panes > div.theme-wrap", {
        effect: 'fade',
        //fadeInSpeed: 200,
        fadeOutSpeed: 400,
        rotate: true
    }).slideshow({autoplay: true, interval: 5000, clickable: false});
});

You have to pass “clickable: false” to the slideshow. The jQuery Tools plugin has good documentation, you should look there first for any other questions you might have.

Leave a Comment