Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Newer
Older
100644 196 lines (194 sloc) 9.835 kB
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
1 <?xml version="1.0"?>
22fafb3 @rdworth Fixed relative urls of xslt
rdworth authored
2 <?xml-stylesheet type="text/xsl" href="../entries2html.xsl" ?>
343cc8f @scottgonzalez Cleanup.
scottgonzalez authored
3 <entry name="tabs" namespace="fn" type="widget" widgetnamespace="ui">
12f32df @scottgonzalez Added <title> for page titles.
scottgonzalez authored
4 <title>Tabs Widget</title>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
5 <desc>A single content area with multiple panels, each associated with a header in a list.</desc>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
6 <longdesc>
0acbbf4 @jzaefferer Tabs: Cleanup description, removing the pseudo-FAQ (mostly invalid an…
jzaefferer authored
7 <p>Tabs are generally used to break content into multiple sections that can be swapped to save space, much like an accordion.</p>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
8
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
9 <p>The content for each tab panel can be defined in-page or can be loaded via Ajax; both are handled automatically based on the <code>href</code> of the anchor associated with the tab. By default tabs are activated on click, but the events can be changed to hover via the <a href="#option-event"><code>event</code></a> option.</p>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
10 </longdesc>
21606fa @scottgonzalez Moved functional CSS comment into resuable note.
scottgonzalez authored
11 <note id="functional-css"/>
24e33d1 @scottgonzalez Change <created> to <added> and display in output. Fixes #33.
scottgonzalez authored
12 <added>1.0</added>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
13 <options>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
14 <option name="active" default="0">
0acbbf4 @jzaefferer Tabs: Cleanup description, removing the pseudo-FAQ (mostly invalid an…
jzaefferer authored
15 <desc>
16 The zero-based index of the panel that is active (open). A negative value select panels going backward from the last panel.
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
17 <p>When the <a href="#option-collapsible"><code>collapsible</code></a> option is set to <code>true</code>, a value of <code>false</code> closes all panels; otherwise nothing happens.</p>
0acbbf4 @jzaefferer Tabs: Cleanup description, removing the pseudo-FAQ (mostly invalid an…
jzaefferer authored
18 </desc>
19 <type name="Boolean" />
20 <type name="Number" />
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
21 </option>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
22 <option name="collapsible" default="false">
23 <desc>When set to <code>true</code>, the active panel can be closed.</desc>
0acbbf4 @jzaefferer Tabs: Cleanup description, removing the pseudo-FAQ (mostly invalid an…
jzaefferer authored
24 <type name="Boolean" />
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
25 </option>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
26 <option name="disabled" default="false">
27 <desc>When set to <code>true</code> or <code>false</code>, all panels will be disabled or enabled, respectively. Can also be set to an array containing the indexes of the tabs (zero-based) that should be disabled, e.g., <code>[ 0, 2 ]</code> would disable the first and third tab.</desc>
0acbbf4 @jzaefferer Tabs: Cleanup description, removing the pseudo-FAQ (mostly invalid an…
jzaefferer authored
28 <type name="Boolean" />
29 <type name="Array" />
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
30 </option>
27af62e @scottgonzalez Tabs: Don't double define type of event option.
scottgonzalez authored
31 <option name="event" default='"click"'>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
32 <desc>The type of event that the tabs should react to in order to activate the tab. To activate on hover, use <code>"mouseover"</code>.</desc>
0acbbf4 @jzaefferer Tabs: Cleanup description, removing the pseudo-FAQ (mostly invalid an…
jzaefferer authored
33 <type name="String" />
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
34 </option>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
35 <option name="heightStyle" default='"auto"'>
0acbbf4 @jzaefferer Tabs: Cleanup description, removing the pseudo-FAQ (mostly invalid an…
jzaefferer authored
36 <desc>
37 Controls the height of the tabs widget and each panel. Possible values:
38 <ul>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
39 <li><code>"auto"</code>: All panels will be set to the height of the tallest panel.</li>
40 <li><code>"fill"</code>: Expand to the available height based on the tabs' parent height.</li>
41 <li><code>"content"</code>: Each panel will be only as tall as its content.</li>
0acbbf4 @jzaefferer Tabs: Cleanup description, removing the pseudo-FAQ (mostly invalid an…
jzaefferer authored
42 </ul>
43 </desc>
44 <type name="String" />
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
45 </option>
0acbbf4 @jzaefferer Tabs: Cleanup description, removing the pseudo-FAQ (mostly invalid an…
jzaefferer authored
46 <option name="hide" default="true">
47 <desc>How to hide a panel.</desc>
48 <type name="Boolean" />
49 <type name="Object" />
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
50 </option>
0acbbf4 @jzaefferer Tabs: Cleanup description, removing the pseudo-FAQ (mostly invalid an…
jzaefferer authored
51 <option name="show" default="true">
52 <desc>How to show a panel.</desc>
53 <type name="Boolean" />
54 <type name="Object" />
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
55 </option>
56 </options>
57 <events>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
58 <event name="activate" type="accordionactivate">
59 <desc>Triggered after a tab has been activated (after animation completes). If the tabs were previously collapsed, <code>ui.oldTab</code> and <code>ui.oldPanel</code> will be empty jQuery objects. If the tabs are collapsing, <code>ui.newTab</code> and <code>ui.newPanel</code> will be empty jQuery objects.</desc>
3e236c2 @scottgonzalez Cleaned up events.
scottgonzalez authored
60 <argument name="event" type="Event"/>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
61 <argument name="ui" type="Object">
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
62 <property name="newTab" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
63 <desc>The tab that was just activated.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
64 </property>
65 <property name="oldTab" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
66 <desc>The tab that was just deactivated.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
67 </property>
68 <property name="newPanel" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
69 <desc>The panel that was just activated.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
70 </property>
71 <property name="oldPanel" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
72 <desc>The panel that was just deactivated.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
73 </property>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
74 </argument>
75 </event>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
76 <event name="beforeActivate" type="accordionbeforeactivate">
ab9660e @scottgonzalez Whitespace.
scottgonzalez authored
77 <desc>Triggered directly after a tab is activated. Can be canceled to prevent the tab from activating. If the tabs are currently collapsed, <code>ui.oldTab</code> and <code>ui.oldPanel</code> will be empty jQuery objects. If the tabs are collapsing, <code>ui.newTab</code> and <code>ui.newPanel</code> will be empty jQuery objects.</desc>
3e236c2 @scottgonzalez Cleaned up events.
scottgonzalez authored
78 <argument name="event" type="Event"/>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
79 <argument name="ui" type="Object">
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
80 <property name="newTab" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
81 <desc>The tab that is about to be activated.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
82 </property>
83 <property name="oldTab" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
84 <desc>The tab that is about to be deactivated.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
85 </property>
86 <property name="newPanel" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
87 <desc>The panel that is about to be activated.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
88 </property>
89 <property name="oldPanel" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
90 <desc>The panel that is about to be deactivated.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
91 </property>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
92 </argument>
93 </event>
7dbf536 @jzaefferer Tabs: Update events to 1.9 API
jzaefferer authored
94 <event name="beforeLoad" type="tabsload">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
95 <desc>Triggered when a remote tab is about to be loaded, after the <a href="#event-beforeActivate"><code>beforeActivate</code></a> event. Can be canceled to prevent the tab panel from loading content; though the panel will still be activated. This event is triggered just before the Ajax request is made, so modifications can be made to <code>ui.jqXHR</code> and <code>ui.ajaxSettings</code>.</desc>
3e236c2 @scottgonzalez Cleaned up events.
scottgonzalez authored
96 <argument name="event" type="Event"/>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
97 <argument name="ui" type="Object">
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
98 <property name="tab" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
99 <desc>The tab that is being loaded.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
100 </property>
101 <property name="panel" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
102 <desc>The panel which will be populated by the Ajax response.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
103 </property>
ad0daab @scottgonzalez Tabs: Improved event documentation.
scottgonzalez authored
104 <property name="jqXHR" type="jqXHR">
105 <desc>The <code>jqXHR</code> object that is requesting the content.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
106 </property>
107 <property name="ajaxSettings" type="Object">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
108 <desc>The settings that will be used by <a href="//api.jquery.com/jQuery.ajax"><code>jQuery.ajax</code></a> to request the content.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
109 </property>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
110 </argument>
111 </event>
ad0daab @scottgonzalez Tabs: Improved event documentation.
scottgonzalez authored
112 <event name="create">
113 <desc>Triggered when the tabs are created. If the tabs are collapsed, <code>ui.tab</code> and <code>ui.panel</code> will be empty jQuery objects.</desc>
3e236c2 @scottgonzalez Cleaned up events.
scottgonzalez authored
114 <argument name="event" type="Event"/>
ad0daab @scottgonzalez Tabs: Improved event documentation.
scottgonzalez authored
115 <argument name="ui" type="Object">
116 <property name="tab" type="jQuery">
117 <desc>The active tab.</desc>
118 </property>
119 <property name="panel" type="jQuery">
120 <desc>The active panel.</desc>
121 </property>
122 </argument>
123 </event>
7dbf536 @jzaefferer Tabs: Update events to 1.9 API
jzaefferer authored
124 <event name="load" type="tabsload">
125 <desc>Triggered after a remote tab has been loaded.</desc>
3e236c2 @scottgonzalez Cleaned up events.
scottgonzalez authored
126 <argument name="event" type="Event"/>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
127 <argument name="ui" type="Object">
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
128 <property name="tab" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
129 <desc>The tab that was just loaded.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
130 </property>
131 <property name="panel" type="jQuery">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
132 <desc>The panel which was just populated by the Ajax response.</desc>
5e33f3e @kborchers Added missing ui-event props and some missing events
kborchers authored
133 </property>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
134 </argument>
135 </event>
136 </events>
137 <methods>
c6ac15f @scottgonzalez Updated widget factory and base widget docs.
scottgonzalez authored
138 <xi:include href="../includes/widget-method-destroy.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
139 <xi:include href="../includes/widget-method-disable.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
140 <method name="disable">
65d34f9 @jzaefferer Tabs: Update methods to 1.9 API
jzaefferer authored
141 <desc>
ad0daab @scottgonzalez Tabs: Improved event documentation.
scottgonzalez authored
142 Disables a tab. The selected tab cannot be disabled. To disable more than one tab at once, set the <a href="#option-disabled"><code>disabled</code></a> option: <code>$( "#tabs" ).tabs( "option", "disabled", [ 1, 2, 3 ] )</code>.
65d34f9 @jzaefferer Tabs: Update methods to 1.9 API
jzaefferer authored
143 </desc>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
144 <argument name="index" type="Number, String">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
145 <desc>The zero-based index of the tab to be disabled. Instead of an index, the <code>href</code> of the tab may be passed.</desc>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
146 </argument>
147 </method>
c6ac15f @scottgonzalez Updated widget factory and base widget docs.
scottgonzalez authored
148 <xi:include href="../includes/widget-method-enable.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
6b2fe03 @jzaefferer Add disable/enable/option/widget methods
jzaefferer authored
149 <method name="enable">
65d34f9 @jzaefferer Tabs: Update methods to 1.9 API
jzaefferer authored
150 <desc>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
151 Enables a tab. To enable more than one tab at once reset the disabled property like: <code>$( "#example" ).tabs( "option", "disabled", [] );</code>.
65d34f9 @jzaefferer Tabs: Update methods to 1.9 API
jzaefferer authored
152 </desc>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
153 <argument name="index" type="Number, String">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
154 <desc>The zero-based index of the tab to be enabled. Instead of an index, the <code>href</code> of the tab may be passed.</desc>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
155 </argument>
156 </method>
157 <method name="load">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
158 <desc>Loads the panel content of a remote tab.</desc>
65d34f9 @jzaefferer Tabs: Update methods to 1.9 API
jzaefferer authored
159 <argument name="index" type="Number, String">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
160 <desc>The zero-baesd index of the tab the be loaded. Instead of an index, the <code>href</code> of the tab may be passed.</desc>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
161 </argument>
162 </method>
6c710f7 @scottgonzalez Renamed inherits to includes.
scottgonzalez authored
163 <xi:include href="../includes/widget-method-option.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
c6ac15f @scottgonzalez Updated widget factory and base widget docs.
scottgonzalez authored
164 <xi:include href="../includes/widget-method-widget.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
165 </methods>
166 <example>
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
167 <desc>A simple jQuery UI Tabs</desc>
168 <code><![CDATA[
169 $( "#tabs" ).tabs();
170 ]]></code>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
171 <html><![CDATA[
172 <div id="tabs">
f2a0b66 @scottgonzalez Tabs: Cleanup.
scottgonzalez authored
173 <ul>
174 <li><a href="#fragment-1"><span>One</span></a></li>
175 <li><a href="#fragment-2"><span>Two</span></a></li>
176 <li><a href="#fragment-3"><span>Three</span></a></li>
177 </ul>
178 <div id="fragment-1">
179 <p>First tab is active by default:</p>
180 <pre><code>$( "#tabs" ).tabs(); </code></pre>
181 </div>
182 <div id="fragment-2">
183 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
184 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
185 </div>
186 <div id="fragment-3">
187 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
188 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
189 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
190 </div>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
191 </div>
192 ]]></html>
193 </example>
80ecaf4 @rdworth Fixed entries2html based on the one in api.jquery.com to put the scri…
rdworth authored
194 <category slug="widgets"/>
f1b270b @rdworth Initial import from jquery-docs repo. New home :)
rdworth authored
195 </entry>
Something went wrong with that request. Please try again.