Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Jul 2002
    Posts
    698
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Collapsable Menu

    This is a vertical collaps menu I made


    Code:
    <html>
    <head>
    <script language='javascript1.2'>   
       //Scrit Name:Collapsable Menu V2.0
       //Created By:Garadon
       //E-Mail:Shashalak@hotmail.com
       //Homepage:www.the-hive.dk/~donp/
    
    function expand(value) 
    {
    
    var antal=3;
    var i=value;
    var move=document.getElementById(i).clientHeight;
    	if(document.getElementById(value).style.visibility=='visible')
    	{
    
    		document.getElementById(value).style.visibility='hidden';  	
    		while(i!=antal)
    		{
    			i++;	
    			document.getElementById(i+'t').style.pixelTop=document.getElementById(i+'t').style.pixelTop-move;		
    		}
    		
    	}
    	else
    	{
    
    		document.getElementById(value).style.visibility='visible';		
    		while(i!=antal)
    		{
    			i++;	
    			document.getElementById(i+'t').style.pixelTop=document.getElementById(i+'t').style.pixelTop+move;		
    		}
    	}
    	
    }
    
    </script>
    </head>
    <body bgColor=Black Text=yellow >
    <table cellspacing=0 cellpadding=0 border=0 id=1t style='position:absolute;left:0px;top:5px;width:150px'>
      <tr>
        <td colspan=2 onClick="expand(1);" bgColor='#555555'>
       	  <B>
            Test1
       	  </B>
        </td>
      </tr>
      <tr>
        <td bgColor='#000000'>
          <table Border=0 bgColor='#333333' style='width:100%;visibility:hidden' id=1> 
    				<tr>
    					<td>
     						Test1
    					</td>
      			</tr>
    	    	<tr>
    	      	<td>
      					Test1
    					</td>
    				</tr>
    				<tr>
    					<td>
      					Test1
    					</td>
    				</tr>
          </table>		
    		</td>
    	</tr>
    </table>
    	
    	
    	
    	
    <table cellspacing=0 cellpadding=0 border=0 id=2t style='position:absolute;left:0px;top:24px;width:150px'>
      <tr>
        <td colspan=2 onClick="expand(2);" bgColor='#555555'>
       	  <B>
            Test2
       	  </B>
        </td>
      </tr>
      <tr>
        <td bgColor='#000000'>
          <table Border=0 bgColor='#333333' style='width:100%;visibility:hidden' id=2> 
    				<tr>
    					<td>
     						Test2
    					</td>
      			</tr>
    	    	<tr>
    	      	<td>
      					Test2
    					</td>
    				</tr>
          </table>		
    		</td>
    	</tr>
    </table>
    
    
    
    <table cellspacing=0 cellpadding=0 border=0 id=3t style='position:absolute;left:0px;top:43px;width:150px'>
      <tr>
        <td colspan=2 onClick="expand(3);" bgColor='#555555'>
       	  <B>
            Test3
       	  </B>
        </td>
      </tr>
      <tr>
        <td bgColor='#000000'>
          <table Border=0 bgColor='#333333' style='width:100%;visibility:hidden' id=3> 
    				<tr>
    					<td>
     						Test3
    					</td>
      			</tr>
    	    	<tr>
    	      	<td>
      					Test3
    					</td>
    				</tr>
    				<tr>
    					<td>
      					Test3
    					</td>
    				</tr>
          </table>		
    		</td>
    	</tr>
    </table>
    	
    </body>
    </html>

  • #2
    Regular Coder
    Join Date
    Aug 2002
    Location
    Spain
    Posts
    420
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Only works in IE
    Don't resist to assimilation. Billions of Borgs can't be wrong!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •