You can change the class names via options (undocumented):
$('#foo').tabs({
navClass: 'my-ui-tabs-nav'
selectedClass: 'my-ui-tabs-selected',
disabledClass: 'my ui-tabs-disabled',
panelClass: 'my-ui-tabs-panel',
loadingClass: 'my-ui-tabs-loading'
});
Although I prefer to style different tabs on one page via context:
.ui-tabs-nav {
/* shared */
}
#one .ui-tabs-nav {
/* additional styles for the first tab interface */
}
#two .ui-tabs-nav {
/* additional styles for second tab interface */
}
Or if you apply the id directly to the ul element:
#one.ui-tabs-nav {
/* additional styles for the first tab interface */
}
--Klaus
On 25 Sep., 17:04, "Dan B." <[EMAIL PROTECTED]> wrote:
> Hi Folks,
>
> I'm interested in having multiple instances of tabs on a page/pages
> throughout a site and on the same page without using an iFrame.
>
> The tabs function is cool. I'd like to pass it a different base
> class, so that basically I have tab controls of different styles on
> the same page.
>
> Specifically I'm wanting to have this set of tabs have different
> widths; I'm looking for like a "base-class" option to pass to
> jquery.tabs or something.
>
> Any suggestions?
>
> dan
