Difference between revisions of "User:Efuchs"
(→Example 2) |
|||
| Line 4: | Line 4: | ||
The '''title''' attribute of the span tag must be the same as the '''id''' attribute of the div tag. | The '''title''' attribute of the span tag must be the same as the '''id''' attribute of the div tag. | ||
| + | |||
| + | <span class="hiddenblock">Adding the class '''hiddenblock''' to your div's will style them like this.</span> | ||
| Line 13: | Line 15: | ||
! style="color:#444" | code | ! style="color:#444" | code | ||
|- style="vertical-align:top;" | |- style="vertical-align:top;" | ||
| − | | width=150 | <span class="toggleblock" title="test">Show/Hide Block</span> <div id="test"> This is a Block </div> | + | | width=150 | <span class="toggleblock" title="test">Show/Hide Block</span> <div id="test" class="hiddenblock"> This is a Block </div> |
|<code><span class="toggleblock" title="test">Show/Hide Block</span></code> | |<code><span class="toggleblock" title="test">Show/Hide Block</span></code> | ||
<code> | <code> | ||
| − | <div id="test"> | + | <div id="test" class="hiddenblock"> |
This is a Block | This is a Block | ||
</div> | </div> | ||
| Line 32: | Line 34: | ||
! style="color:#444" | code | ! style="color:#444" | code | ||
|- style="vertical-align:top;" | |- style="vertical-align:top;" | ||
| − | | width=150 | <span class="toggleblock" title="test2">Show/Hide Block [<font>+</font><font style="display:none;">–</font>]</span> <div id="test2"> This is a Block </div> | + | | width=150 | <span class="toggleblock" title="test2">Show/Hide Block [<font>+</font><font style="display:none;">–</font>]</span> <div id="test2" class="hiddenblock"> This is a Block </div> |
|<code><span class="toggleblock" title="test2">Show/Hide Block [<font>+</font><font style="display:none;">–</font>]</span></code> | |<code><span class="toggleblock" title="test2">Show/Hide Block [<font>+</font><font style="display:none;">–</font>]</span></code> | ||
<code> | <code> | ||
| − | <div id="test2"> | + | <div id="test2" class="hiddenblock"> |
This is a Block | This is a Block | ||
</div> | </div> | ||
</code> | </code> | ||
|} | |} | ||
Latest revision as of 13:47, 24 October 2007
Hide an Object
Copy the examples below to show / hide objects.
The title attribute of the span tag must be the same as the id attribute of the div tag.
Adding the class hiddenblock to your div's will style them like this.
Example 1
| example | code |
|---|---|
| Show/Hide Block This is a Block
|
<span class="toggleblock" title="test">Show/Hide Block</span>
|
Example 2
+ / - displays status of block
| example | code |
|---|---|
| Show/Hide Block [+–] This is a Block
|
<span class="toggleblock" title="test2">Show/Hide Block [<font>+</font><font style="display:none;">–</font>]</span>
|
