Template:Switchable: Difference between revisions
Jump to navigation
Jump to search
mNo edit summary |
mNo edit summary |
||
Line 1: | Line 1: | ||
<div class="switchable tabs{{{align|left}}} float{{{float|none}}}"> | <div class="switchable tabs{{{align|left}}} float{{{float|none}}}" style="width: {{{width|auto}}};"> | ||
<div class="switch" data-switchable-title="{{{1}}}"> | <div class="switch" data-switchable-title="{{{1}}}"> | ||
{{{2}}} | {{{2}}} | ||
Line 42: | Line 42: | ||
! align | ! align | ||
| No || left || Tab alignment || Whether to align the tabs <code>left</code> (default), <code>right</code>, or <code>center</code>. | | No || left || Tab alignment || Whether to align the tabs <code>left</code> (default), <code>right</code>, or <code>center</code>. | ||
|- | |||
! width | |||
| No || || Container width || Set an optional width for the tab container. | |||
|- | |- | ||
! float | ! float | ||
Line 52: | Line 55: | ||
==Skeleton== | ==Skeleton== | ||
<pre> | <pre> | ||
{{switchable | <title 1> | <content 1> | <title 2> | <content 2> | <title 3> | <content 3> | <title 4> | <content 4> | <title 5> | <content 5> | align=<tab alignment> | float=<container float> | showall=<show all>}} | {{switchable | <title 1> | <content 1> | <title 2> | <content 2> | <title 3> | <content 3> | <title 4> | <content 4> | <title 5> | <content 5> | align=<tab alignment> | width=<container width> | float=<container float> | showall=<show all>}} | ||
</pre> | </pre> | ||
Revision as of 11:24, July 16, 2024
{{{2}}}
Info
This template makes it easy to have content that can be switched by user-clicked buttons. Only the first "box" is shown, and all others are hidden, until they are clicked on.
Parameters
Parameter | Mandatory | Default | Purpose | Detailed description |
---|---|---|---|---|
1 | Yes | Title 1 | Title of the first "box" of content. | |
2 | Yes | Content 1 | Content of the first "box". | |
3 | Yes | Title 2 | Title of the second "box" of content. | |
4 | Yes | Content 2 | Content of the second "box". | |
5, 7, 9 | No | Title 3 to 5 | Title of the third to fifth "boxes" of content. | |
6, 8, 10 | No | Content 3 to 5 | Content of the third to fifth "boxes". | |
align | No | left | Tab alignment | Whether to align the tabs left (default), right , or center .
|
width | No | Container width | Set an optional width for the tab container. | |
float | No | none | Container float | Whether to float the tab container none (default), or to the left or right . Used for placing content beside the tabs and box.
|
showall | No | Show all boxes | If this has a value, like "y", all boxes are shown by nature, but hidden when the script starts. This is useful for readers who do not have JavaScript running, as they can then see all boxes one right after the other (this is because the buttons need JavaScript to work). |
Skeleton
{{switchable | <title 1> | <content 1> | <title 2> | <content 2> | <title 3> | <content 3> | <title 4> | <content 4> | <title 5> | <content 5> | align=<tab alignment> | width=<container width> | float=<container float> | showall=<show all>}}
Examples
Code | Result |
---|---|
{{switchable|Red|Red Pikmin|Yellow|Yellow Pikmin}} |
Red Pikmin |
{{switchable|Red|Red Onion|Yellow|Yellow Onion|Blue|Blue Onion}} |
Red Onion |