This document includes the JavaScript and CSS for collapsible panels, including additional CSS for nested collapsibles. The includedoc for this page should be enclosed in an External tag: <span class="external"><a class="includedoc">30887</a></span>.

Note: <span class="external"> must use double quotes (") instead of single (').

Instructions

• To use both internal and external stylesheets in the same document, copy and paste the following code into the "JavaScript/CSS" field (under "Additional Fields" at the bottom):
  <span class="internal"><a class="includedoc">30876</a></span> <span class="external"><a class="includedoc">30887</a></span>
• For 'collapse all' and 'expand all' links, insert <div class='collapsibleExpander'></div>. This will automatically generate the necessary links.
• Collapsible panels are enclosed in <div class='collapsible'> elements. They will be colored to match the External site.
• Nested collapsibles can have a separate color scheme, to distinguish them from the top-level panels. These are identified by <div class='collapsible nested'> tags. These can be further offset by enclosing them in <div class='nest'> tags, which adds indentation on both the left and right sides.
• To set a panel to be expanded by default, add 'open' to that particular panel's class name. For example, <div class='collapsible nested open'>
• A few examples of documents that use these includes are:
  • Locating the Name of Your Computer
  • Java - Compatible Versions for UW Services