asked on

Expand / Collapse Code for ASP Classic website (tables, rows, columns, not div) site

Hi there, I have been looking around but unable to find specifically what I want...

I have an ASP Classic website (tables, rows, columns, not div) and I want to add expand and collapse fields

found plenty for div, but not much (that make any sense) for tables, any help on this would be great

Graeme McGilvray

ASKER

I have found some code which does the trick and is work, however I want the expand/collapse to start in the collapse position..

Help?

<SCRIPT LANGUAGE="JavaScript">

function Expand(node)
{
          // Change the image (if there is an image)
          if (node.children.length > 0)
          {
               if (node.children.item(0).tagName == "IMG")
               {
                    node.children.item(0).src = "s-collapse.png";
               }
          }

          node.nextSibling.style.display = '';
}

function Collapse(node)
{
          // Change the image (if there is an image)
          if (node.children.length > 0)
          {
               if (node.children.item(0).tagName == "IMG")
               {
                    node.children.item(0).src = "s-expand.png";
               }
          }

          node.nextSibling.style.display = 'none';
}

function Toggle(node)
{
     // Unfold the branch if it isn't visible
     if (node.nextSibling.style.display == 'none')
     {
        /*
          // Change the image (if there is an image)
          if (node.children.length > 0)
          {
               if (node.children.item(0).tagName == "IMG")
               {
                    node.children.item(0).src = "s-expand.png";
               }
          }

          node.nextSibling.style.display = '';
          */
          Expand(node);
     }
     // Collapse the branch if it IS visible
     else
     {
        /*
          // Change the image (if there is an image)
          if (node.children.length > 0)
          {
               if (node.children.item(0).tagName == "IMG")
               {
                    node.children.item(0).src = "s-collapse.png";
               }
          }

          node.nextSibling.style.display = 'none';
         */
         Collapse(node);
     }

}
</SCRIPT>
<TABLE border=0>
          <TR><TD><A onClick="Toggle(this)" id="CorporateStaff" style="CURSOR: hand"><IMG SRC="s-collapse.png" height=40> <u>Corporate Staff</u></a><DIV>
               <TABLE border=0>
               <tr>
                   <TD WIDTH=10></TD>
                   <td>User 1</td>
                   <td>User 1</td>
                   <td>User 1</td>
               </tr>
               <tr>
                   <TD WIDTH=10></TD>
                   <td>User 2</td>
                   <td>User 2</td>
                   <td>User 2</td>
               </tr>
               <tr>
                   <TD WIDTH=10></TD>
                   <td>User 3</td>
                   <td>User 3</td>
                   <td>User 3</td>
               </tr>
               </table>
        </DIV></TD></TR>                
</TABLE>

Open in new window

This question needs an answer!

Become an EE member today

7 DAY FREE TRIAL

Members can start a 7-Day Free trial then enjoy unlimited access to the platform.

View membership options

Learn why we charge membership fees

We get it - no one likes a content blocker. Take one extra minute and find out why we block content.