CODEWITHSUNDEEP
jquery-uisyntaxtabseffects
DogBot
DogBot

Reputation: 21

How to implement sliding effect on jQueryUI Tabs

I have jQueryUI tabs set to fade between tabs. But I would like to apply other effects, perhaps sliding. But since I am a newbie to jQuery I cannot seem to get the syntax right.

This is what works right now:
$( "#tabs" ).tabs({ fx: { opacity: 'toggle', duration:500} });

This however does NOT work:
$( "#tabs" ).tabs({ fx: { slide: 'toggle',duration:500} });

or this:
$( "#tabs" ).tabs({ fx: { slide: 'toggle',direction:'down',duration:500} });

I have also tried slideUp, slideDown, even explode..nothing other than opacity seems to work.

Upvotes: 2

Views: 3829

Answers (2)

kishore
kishore

Reputation: 11

try this one

$("#tabs").tabs({ fx: { height: 'toggle', duration: 1000 } });

Upvotes: 1

Kyle
Kyle

Reputation: 1733

Have you tried this?

$("#tabs").tabs({fx:{height: "toggle"}}).tabs("slideDown", 500);

Upvotes: 0

Related Questions