Onglets jQuery ui: effet de glissement lors de la commutation entre les onglets

Question

J'utilise les onglets jquery ui. Je veux appliquer un effet de contenu glissant lorsque je passe d'un onglet à l'autre en affichant et en masquant le contenu des onglets. Voici mon

J'essaie de faire glisser les div divs avec le contenu en eux lorsque je clique sur la navigation au-dessus de tout. Donc lien Nav 1 glisserait le contenu des onglets #-1 en face de l'écran, etc.

Le script que j'ai actuellement, ce qui n'a pas de fonctionnalité de glissement est:

$(document).ready(function() { 
    $('#tabs').tabs(); 

    $('.sub-nav a').click(function() { 
    $('.sub-nav li a').removeClass('subnav-active'); 
    $(this).addClass('subnav-active'); 
    }); 

}); 

J'ai essayé de faire slideToggle, ainsi que juste un effet fading out et fading in, mais ne pouvait pas obtenir l'un ou l'autre de travailler. Donc, je cherche de l'aide, même si tout est, est quelque part à regarder, ce serait grandement apprécié puisque je ne suis pas le meilleur à javascript ou jQuery.

Answer 1

jQueryUI intègre des effets. Pas besoin de rouler les vôtres.

http://api.jqueryui.com/slide-effect/

http://jsfiddle.net/isherwood/9jg4r/4/

$('#tabs').tabs({ 
    hide: { 
     effect: "slide", 
     duration: 1000 
    } 
}); 

Voici un exemple avec spectacle et effets cacher: http://jsfiddle.net/isherwood/9jg4r/5