Go Back   CodingForums.com > :: Client side development > JavaScript programming > Post a JavaScript

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 11-23-2002, 04:04 PM   PM User | #1
Garadon
Regular Coder

 
Join Date: Jul 2002
Posts: 698
Thanks: 0
Thanked 0 Times in 0 Posts
Garadon is an unknown quantity at this point
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>
Garadon is offline   Reply With Quote
Old 11-24-2002, 01:07 AM   PM User | #2
Borgtex
Regular Coder

 
Join Date: Aug 2002
Location: Spain
Posts: 420
Thanks: 0
Thanked 0 Times in 0 Posts
Borgtex is an unknown quantity at this point
Only works in IE
__________________
Don't resist to assimilation. Billions of Borgs can't be wrong!
Borgtex is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 05:19 AM.


Advertisement
Log in to turn off these ads.