Hi all,
from the beginning the plugin was relying on a certain HTML structure
<div id="container">
<ul>
...
<ul>
<div id="tab-1">
...
</div>
...
</div>
For some more flexibility and being able to apply somewhat advanced
styling I have added another option:
tabSelector
Default is as-is state: '>div' ("start point" is the container that
holds the tabs links and content).
But if you want a structure that is more deeply nested you can
initialize your tabs like that:
$('#container').tabs({
tabSelector: '>div>div'
});
and have a structure like this:
<div id="container">
<ul>
...
<ul>
<div>
<div id="tab-1">
...
</div>
...
<div>
</div>
Used together with fade and autoheight for example such a structure
allows for fading the tabs content and still have a border around it
that won't fade - if I remember correctly, Jörn once or twice asked for
something like this (hi Jörn!).
Have a look at the last example here:
http://stilbuero.de/jquery/tabs/
Hence you could use an ordered list or whatever for your tabs:
<div id="container">
<ul>
...
<ul>
<ol>
<li id="tab-1">
...
</li>
...
<ol>
</div>
$('#container').tabs({
tabSelector: '>ol>li'
});
Be careful when you want to use another unordered list ;-)
$('#container').tabs({
tabSelector: '>ul:eq(1)>li'
});
Not sure if this is the way to go, but it was the only possibility
without breaking all the usages out there. But this gives the most
flexibility I think.
Also not sure if name for the option is well chosen? Suggestions welcome...
Now on to the documentation...
Cheers,
Klaus
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
