Difference between revisions of "User:Efuchs"
(2 intermediate revisions by one other user not shown) | |||
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 9: | Line 11: | ||
{| cellpadding="10" cellspacing="4" style="text-align:left;" | {| cellpadding="10" cellspacing="4" style="text-align:left;" | ||
+ | |- | ||
+ | ! style="color:#444" | example | ||
+ | ! 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 25: | Line 30: | ||
{| cellpadding="10" cellspacing="4" style="text-align:left;" | {| cellpadding="10" cellspacing="4" style="text-align:left;" | ||
+ | |- | ||
+ | ! style="color:#444" | example | ||
+ | ! 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=" | + | |<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>
|