Menu a tendina alto

| Home |

| Indice Javascript |

Clock

Browser

Finestre

Status Bar

Background

Calcolatrici

Grafica ed Effetti

Convertitori

Utility

Form

Menu e Link

Menu a tendina alto

Visualizza l'esempio

Usa Copia e incolla questa è la sorgente

//Do you want it to move with the page if the user scroll the page?
var moveOnScroll=true

//Do you want to hide all the other submenus when you click a new?
var hideAll=true

/********************************************************************************
If you want to change the appearans on the text, or background or anything
do that in the style tag above, or in the table tag below.

NOTE: This menu have some "small" bugs.
In Netscape the links in the submenus will work even though the
submenus are hidden, this has something to do with
a lousy implementation of the relative positioning in Netscape.
In IE links "underneath" the submenus will not work even though the
submenus are hidden.
I will look into this and might find a fix for it.
********************************************************************************/

/********************************************************************************
Object constructor
********************************************************************************/
function makeMenuBar(obj,nest,vis){
    nest=(!nest) ? '':'document.'+nest+'.'
    this.css=(n) ? eval(nest+'document.'+obj):eval(obj+'.style')
	this.hideIt=b_hideIt;	this.showIt=b_showIt; this.vis=b_vis						
	if(ie && vis) this.css.visibility='hidden'
	this.state=1
	this.go=0
	this.height=n?this.css.document.height:eval(obj+'.offsetHeight')
	this.top=b_gettop
    this.obj = obj + "Object"; 	eval(this.obj + "=this")	
}
//Get's the top position.
function b_gettop(){
	var gleft=(n) ? eval(this.css.top):eval(this.css.pixelTop);
	return gleft;
}
//The functions for showing and hiding
function b_showIt(){
	this.css.visibility="visible"
}
function b_hideIt(){
	this.css.visibility="hidden"
}
function b_vis(){
	if(this.css.visibility=="hidden" || this.css.visibility=="hide") return true;
}
/********************************************************************************
Checking if the page is scrolled, if it is move the menu after
********************************************************************************/
function checkScrolled(){
	if(!oMenu.go)oMenu.css.top=(!oMenu.state)?eval(scrolled):eval(scrolled)
	if(n) setTimeout('checkScrolled()',30)
}
/********************************************************************************
Inits the page, makes the menu object, moves it to the right place, 
show it..
********************************************************************************/
function menuBarInit(){
	oSub=new Array()
	//Change it here if you want more or less submenus.
	oSub[0]=new makeMenuBar('divSub0','divBg',1)
	oSub[1]=new makeMenuBar('divSub1','divBg',1)
	oSub[2]=new makeMenuBar('divSub2','divBg',1)
	oSub[3]=new makeMenuBar('divSub3','divBg',1)
	oSub[4]=new makeMenuBar('divSub4','divBg',1)
	//Moving menuBar
	oMenu=new makeMenuBar('divBg')
	scrolled=n?"window.pageYOffset":"document.body.scrollTop"
	oMenu.css.top=eval(scrolled)
	oMenu.css.visibility='visible'
	if(moveOnScroll) ie?window.onscroll=checkScrolled:checkScrolled();
}

/********************************************************************************
Shows and hides the submenus
********************************************************************************/
function extract(num){
	if(hideAll){
		for(i=0;i<oSub.length;i++){
			if(num!=i) oSub[i].hideIt()
		}
	}
	!oSub[num].vis()?oSub[num].hideIt():oSub[num].showIt();

}

onload=menuBarInit;
</script>
</head>
<body>
<div id="divBg">
<table width="102%" border="0" cellspacing="0" cellpadding="5" align="CENTER" valign="MIDDLE">
<tr bgcolor="#C0C0C0">
<td height="30"><a href="#" onclick="extract(0); return false">MAILING LIST</a></td>
<td><a href="#" onclick="extract(1); return false">JAVASCRIPT</a></td>
<td><a href="#" onclick="extract(2); return false">GRAFICA</a></td>
<td><a href="#" onclick="extract(3); return false">APPLET</a></td>
<td><a href="#" onclick="extract(4); return false">CHAT</a></td>
</tr>

<tr>
<td valign="TOP">
<div id="divSub0" class="clSub">

<a href="http://www.massimo61.org/mlist/">Mailing List gratuite</a>
			
</div>
</td>
<td valign="TOP">
<div id="divSub1" class="clSub">
<a href="http://www.massimo61.org/javascript">Raccolta JavaScript</a>
			
</div>
</td>
<td valign="TOP">
<div id="divSub2" class="clSub">
<a href="http://www.massimo61.org/grafica/">Grafica</a>
</div>
</td>
<td valign="TOP">
<div id="divSub3" class="clSub">
<a href="http://www.massimo61.org/applet/">Raccolta Applet Java</a><br>
<a href="http://www.massimo61.org/my_applet/">My Java Applet</a><br>
<a href="http://www.massimo61.org/anfy/">Anfy Applet</a>
			
</div>
</td>
<td valign="TOP">
<div id="divSub4" class="clSub">
<a href="http://lnx.massimo61.org/java_chat/">Java Chat</a><br>
<a href="http://www.massimo61.org/asp_chat/">Chat ASP</a>
</div>
</td>
</tr>
</table>
</div>
<br><br><br><br>
<p><center>
<font face="Verdana" size="-2">Free JavaScripts da<br>
<a href="http://www.massimo61.org/">Free Web Upgrade</a></font>
</center><p>