User:SharpShot gif/Collapsible

Thanks to NoseOfCthulhu and Krinkle Show/Hide nothing to show sorry

Collapsible div


Collapsible div nested in collapsed div
Hi there this is text in the outer div. This content is inside the nested collapsible div.

Collapsible table in collapsed div
Some text in the div here. Some more text in the div.

Collapsible unordered list
 Lorem Ipsum Dolor 

Collapsible ordered list
 One Two is more than one ..a total of three items! 

Pre-made toggle
image here image here

Pre-made toggle with link in it
This is a toggle with link to the top of the page

Remote collapsible 1 (div, multiple togglers) @

 * @

Click here or on one of the @'s to expand the hidden element.

image here &lArr; @@Clicking here or on At-image will toggle also@@

Custom collapsible 2 (table)
Click here to toggle the table.

Custom collapsible 3 (list)
Click here to toggle the list.

 A B <li>C <li>D </ul>

Custom collapsible 5 (double purpose toggle)
I am custom collapsible "DPT".

<span class="mw-collapsible-toggle mw-customtoggle-DPT" style="cursor: pointer; border: 1px solid #aaa; border-radius: 5px; padding: 2px;">I am a toggle for my parent ("collapsible div") and custom toggle for "DPT". I am a collapsible div.

Combination example
<ul class="mw-collapsible mw-collapsed" data-collapsetext="I understand" data-expandtext="Click here for more information"> <li>Table is collapsed by default <li>Second row contains collapsible list <li>Third row contains a collapsible block with custom labels </ul>