Template:test100

<h1>Template:CollapsibleTOC</h1>
  <pre class="script">// CollapsibleTOC template, by neilw, 2009
// Versions
//    1.00    9/2/09    neilw
//    1.01    4/19/10   neilw        Use wiki.toc() instead of page.toc to reduce FOUC
//    1.10    8/9/10    neilw        added option to remove numbering

// USAGE: CollapsibleTOC()
//    This outputs a collapsible table of contents for the current page.  The output is
//    "raw", without any enclosing table or anything, so you can wrap it in whatever
//    style you like.

var numbering = $0 ?? $numbering ?? true;

// Output
&lt;html&gt;
// Scripts go in the head
&lt;head&gt;
//
// First script element is unique to each template call, passing args to the common code
//
&lt;script type="text/javascript"&gt;"
DekiWiki.$(document).ready(function($) { collapse_toc($, "..json.emit(@id)..","..json.emit(numbering).."); });
"&lt;/script&gt;
//
// This script element is always the same, so only one copy will end up on the page even if the
// template is called multiple times
//
&lt;script type="text/javascript"&gt;"
function collapse_toc($, id, numbers) {
// Find the list
    var $list;
    var pid = 'p#' + id;
    var $nodes = $(pid).nextAll();
    for (var i = 0; i &lt; $nodes.length; i++) {
        $list = $nodes.eq(i);
        if ($list.is('ol'))
            break;
        $list = $list.find('ol:first');
        if ($list.length &gt; 0)
            break;
    }
// Make sure we found it
    if ($list.length == 0) {
 alert(\"ERROR: CollapsibleTree: can\'t find the TOC\");
 return;
    }
    $list.children('li').find('ol:first').hide(); // hide first level ASAP
    $(pid).next().show();
// Recursively traverse list
    collapse_toc_recurse($, $list, numbers);
}

function collapse_toc_recurse($, $list, numbers) {
// Make each list item collapsible
    $list.children('li').each(function () {
    // Get rid of bullet and insert icon in front of each list item
        $(this).css({'margin-left':'0', 'padding-left':'0', 'list-style-type':'none'}).
            prepend('&lt;span class=\"icon\"&gt;&lt;img style=\"vertical-align: middle; margin-bottom: 5px\" src=\"/skins/common/icons/icon-trans.gif\" /&gt; &lt;/span&gt;');
    // Remove numbering if necessary
        if (!numbers) $(this).find('span:eq(1)').remove();
    // Find and hide inner OL, if any
        var $ol  = $(this).children('ol:first').hide();
        var $img = $(this).find('img:first');
    // If appropriate, link icon to toggle function and recurse
        if ($ol.length) {
            $img.attr('class', 'contract');
            $img.css('cursor','pointer').click(function() {
                if ($ol.css('display') == 'none') {
                    $ol.slideDown('fast');
                    $(this).attr('class', 'expand');
                }
                else {
                    $ol.slideUp  ('fast');
                    $(this).attr('class', 'contract');
                }
                return(false);
            });
        // recurse
            collapse_toc_recurse($, $ol, numbers);
        }
    });
}
"&lt;/script&gt;
&lt;/head&gt;
// Content goes in the body
&lt;body&gt;
    &lt;p id="{{@id}}" style="display:none;" /&gt;;
    wiki.toc(page.path);
&lt;/body&gt;
&lt;/html&gt;</pre>