• If you are citizen of an European Union member nation, you may not use this service unless you are at least 16 years old.

  • Whenever you search in PBworks or on the Web, Dokkio Sidebar (from the makers of PBworks) will run the same search in your Drive, Dropbox, OneDrive, Gmail, Slack, and browsed web pages. Now you can find what you're looking for wherever it lives. Try Dokkio Sidebar for free.



Page history last edited by PBworks 16 years, 10 months ago

Make an option to toggle contents on/off (Part 2)


by vietmusic


Method 2


The basic idea of the first content toggle was to wrap the <toc> in another div, and make that disappear. But if you've seen Wikipedia, you know that their toggle is embedded inside of the table. You can do that too, with some ingenuity.





Just paste the following code into your wiki page, preferably at the bottom. Then, just put your Table of Contents with <toc> anywhere you want, and it'll automatically embed a toggle INSIDE of the contents. Furthermore, you can have as many <toc>'s as you want (a limitation of the other way is that there's just one per page). Alternatively, put it at the bottom of your SideBar and then it'll work ANYWHERE in your wiki.


<script language="javascript">
var allPageTags = new Array(); 
var allPageTags=document.getElementsByTagName("*");


function loadMe() {
for (i=0; i<allPageTags.length; i++) {
if (allPageTags[i].className=="toc")
allPageTags[i].innerHTML = "<div style="margin-left:-15px;text-align:center"><a href="javascript:TOCToggle(" + i + ")"><b><small>Contents (Hide)</small></b></a></div>" + '<div id="toctog' + i + '">' + allPageTags[i].innerHTML + '</div>';

function TOCToggle(id_num) {
if (document.getElementById("toctog"+id_num).style.display == "none") {
    document.getElementById("toctog"+id_num).style.display = "block";
    allPageTags[id_num].innerHTML = allPageTags[id_num].innerHTML.replace("Contents (Show)","Contents (Hide)");
else {
    document.getElementById("toctog"+id_num).style.display = "none";
    allPageTags[id_num].innerHTML = allPageTags[id_num].innerHTML.replace("Contents (Hide)","Contents (Show)");




See above.


Go Back to Part I

Comments (0)

You don't have permission to comment on this page.