Menu on off

Contenu du snippet

Script permettant d'ouvrir ou ferme un menu de manière independante
Cliquez sur titre1 ou titre2 pour mettre son contenu en visible ou invisible

Source / Exemple :


<html>
<!-- Date de création: 11/03/2003 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title></title>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="francis RICHARD">
<meta name="generator" content="WebExpert 5">
<style>
.cadre 
	{
	border-left: solid 1px black;
	border-top: solid 1px black;
	border-right: solid 1px black;
	border-bottom: solid 1px black;
	
	}
</style>
</head>
<body>
<script language=javascript>
var etat_titre1=1;  //1 ouvert  -1 ferme
var etat_titre2=1;

function vouc(nom)
{
	switch(nom)
		{
		case 'titre1' : 
			if(etat_titre1==-1)
			{
				document.getElementById(nom).style.display='none';
				etat_titre1=1;
			}
			else
			{
				document.getElementById(nom).style.display='block';
				etat_titre1=-1;
			}
			break;
		case 'titre2' : 
			if(etat_titre2==-1)
			{
				document.getElementById(nom).style.display='none';
				etat_titre2=1;
			}
			else
			{
				document.getElementById(nom).style.display='block';
				etat_titre2=-1;
			}
			break;
		
		}
	
	
}
</script><br>
<div align="left"><font size="-1">Cliquez sur titre 1 ou titre 2 pour réduire </font></div>
<table class=cadre width="180" onclick="javascript:vouc('titre1')" border="0" cellspacing="0" cellpadding="0">
			
			<tr >
				
				<td  bgcolor="#6699cc" align=center ><b><font face="Arial" size="2" color="#ffffff">VOTRE TITRE 1</font></b></td>
				
			</tr>
</table>
<div id="titre1"> <!-- debut de la partie en on off -->
<table class=cadre width="180"   border="0" cellspacing="0" cellpadding="0">
				<tr>
              <td ><a href="page1.htm" target="centre">page 1</a></td>
				</tr>
				<tr>
              <td ><a href="page2.htm" target="centre">page 2</a></td>
				</tr>
				<tr>
              <td ><a href="page3.htm" target="centre">page 3</a></td>
				</tr>
				
				
						
	</table>
</div><!-- fin de la partie en on off -->

<br><br>

<table class=cadre width="180" onclick="javascript:vouc('titre2')" border="0" cellspacing="0" cellpadding="0">
			
			<tr >
				
				<td  bgcolor="#6699cc" align=center ><b><font face="Arial" size="2" color="#ffffff">VOTRE TITRE 2</font></b></td>
				
			</tr>
</table>
<div id="titre2"><!-- debut de la partie en on off -->
<table class=cadre width="180"   border="0" cellspacing="0" cellpadding="0">
				<tr>
              <td ><a href="page4.htm" target="centre">page 4</a></td>
			   </tr>
				<tr>
              <td ><a href="page5.htm" target="centre">page 5</a></td>
				</tr>
				<tr>
              <td ><a href="page6.htm" target="centre">page 6</a></td>
				</tr>
				
				
						
	</table>
</div><!-- fin de la partie en on off -->

<script language=javascript>

vouc('titre1');
vouc('titre2');

</script>
</body>
</html>

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.