begin process at 2010 03 22 09:16:07
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Menu & Co

 > MENU HORIZONTAL ET VERTICAL

MENU HORIZONTAL ET VERTICAL


 Information sur la source

Note :
8,2 / 10 - par 5 personnes
8,20 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Menu & Co Niveau :Débutant Date de création :01/09/2004 Date de mise à jour :25/04/2005 02:47:05 Vu / téléchargé :29 354 / 3 308

Auteur : larion

Ecrire un message privé
Site perso
Commentaire sur cette source (23)
Ajouter un commentaire et/ou une note

 Description

Cliquez pour voir la capture en taille normale
Un menu horizontal/vertical simple et facile à configurer.

Pour une version plus riche en fonctionnalité, voir http://menuhorizontal.pass-x.com

Source

  • <html>
  • <head>
  • <SCRIPT>
  • menuhz = 1 //1:menu horizontal 0:menu vertical
  • bgcolor ='#000000'; //Couleur arrière
  • bgcolor2='#A7B2E9'; //Couleur arrière surbrillance
  • bgcolor3='#6375D6'; //Couleur bordure
  • bgcolor4='#ffffff'; //Couleur texte
  • largeur = 110
  • hauteur = 22
  • i = 0
  • menup = new Array;
  • menup[i++]='Programme'; //<- Nom
  • menup[i++]='index.html'; //<- Adresse
  • menup[i++]='SreenShow';
  • menup[i++]='ScreenShow.html';
  • menup[i++]='Changelog';
  • menup[i++]='Changelog.html';
  • menup[i++]='Forum';
  • menup[i++]='http://multidesk.pass-x.com'; // Un exemple du script
  • menup[i++]='Télécharger';
  • menup[i++]='Telecharger.html';
  • document.write('<style>');
  • document.write('.ejsmenu {color:'+bgcolor4+'; cursor:hand;}') //default
  • document.write('</style>')
  • document.write('<DIV ID=top><TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 BGCOLOR='+bgcolor3+' WIDTH='+(menuhz?largeur*menup.length/2:largeur) +' HEIGHT='+hauteur+'><TR><TD><TABLE CELLPADING=0 CELLSPACING=1 BORDER=0 WIDTH=100% HEIGHT=100%>'+(menuhz?'<tr>':''))
  • for(pass=0;pass<menup.length;pass+=2)
  • document.write((menuhz?"":"<tr>")+"<TD WIDTH="+largeur+" ALIGN=center BGCOLOR="+bgcolor+" onMouseDown='location.href=\""+menup[pass+1]+"\"' onMouseOver='this.style.background=\""+bgcolor2+"\"' onMouseOut='this.style.background=\""+bgcolor+"\"' CLASS=ejsmenu><FONT SIZE=2 FACE=Verdana><B>"+menup[pass]+"</B></FONT></TD>")
  • document.write('</tr></TABLE></TD></TR></TABLE></DIV>')
  • </SCRIPT>
  • </body>
  • </html>
<html>
<head>

<SCRIPT>
menuhz  = 1          //1:menu horizontal  0:menu vertical
bgcolor ='#000000';  //Couleur arrière
bgcolor2='#A7B2E9';  //Couleur arrière surbrillance
bgcolor3='#6375D6';  //Couleur bordure
bgcolor4='#ffffff';  //Couleur texte
largeur = 110
hauteur = 22
i       = 0
menup = new Array;
menup[i++]='Programme';   //<- Nom 
menup[i++]='index.html';  //<- Adresse
menup[i++]='SreenShow';
menup[i++]='ScreenShow.html';
menup[i++]='Changelog';
menup[i++]='Changelog.html';
menup[i++]='Forum';
menup[i++]='http://multidesk.pass-x.com'; // Un exemple du script
menup[i++]='Télécharger';
menup[i++]='Telecharger.html';

document.write('<style>');
document.write('.ejsmenu {color:'+bgcolor4+'; cursor:hand;}') //default
document.write('</style>')
document.write('<DIV ID=top><TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 BGCOLOR='+bgcolor3+' WIDTH='+(menuhz?largeur*menup.length/2:largeur) +' HEIGHT='+hauteur+'><TR><TD><TABLE CELLPADING=0 CELLSPACING=1 BORDER=0 WIDTH=100% HEIGHT=100%>'+(menuhz?'<tr>':''))

for(pass=0;pass<menup.length;pass+=2) 
 document.write((menuhz?"":"<tr>")+"<TD WIDTH="+largeur+" ALIGN=center BGCOLOR="+bgcolor+" onMouseDown='location.href=\""+menup[pass+1]+"\"' onMouseOver='this.style.background=\""+bgcolor2+"\"' onMouseOut='this.style.background=\""+bgcolor+"\"' CLASS=ejsmenu><FONT SIZE=2 FACE=Verdana><B>"+menup[pass]+"</B></FONT></TD>")

document.write('</tr></TABLE></TD></TR></TABLE></DIV>')
</SCRIPT>
</body>
</html>


 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Historique

03 septembre 2004 14:32:59 :
Ajout d'une capture écran à cette source.
25 avril 2005 02:47:05 :
Possibilité de configurer en menu vertical Ajout d'un fichier Zip

 Sources du même auteur

Source avec Zip Source avec une capture MENU TOUJOURS A LA MEME POSITION TRES FLUIDE
Source avec Zip Source avec une capture CHANGER DE THEME ET DE COULEUR
Source avec Zip Source avec une capture TRI DYNAMIQUE D'UN TABLEAU HTML AVEC RECONNAISSANCE AUTOMATI...
Source avec Zip Source avec une capture MENU HORIZONTAL DYNAMIQUE AVEC SOUS-MENUS AVEC FONDU
Source avec une capture MENU VERTICAL AVEC SOUS-MENUS

 Sources de la même categorie

Source avec Zip Source avec une capture MENU VERTICALE GAUCHE ET DROIT DEROULANT par kazma
Source avec Zip Source avec une capture MENU VERTICALE EN TRANSPARENCE par dlvains
Source avec Zip Source avec une capture MENU DÉROULANT EN IMAGES par dlvains
Source avec Zip TBFRAME: TAB BROWSING FRAME par triumphs
Source avec Zip Source avec une capture MENU PRINCIPAL par ali1987

Commentaires et avis

Commentaire de WindPowa le 10/09/2004 01:54:46

Petit exemple, simple mais agréable. 8/10

Commentaire de Phenixdu59 le 18/09/2004 18:31:41

je comprends pas comment y marche, le code fo que je le meette ou ?

Commentaire de larion le 18/09/2004 18:50:29

C'est du JavaSript :
Il faut copier ce code dans un fichier "Menu.js" par exemple.
Puis dans les pages html, écrire entre les balises <body> et </body> :
<script language="JavaScript" src="Menu.js" type="text/JavaScript"></script>

Commentaire de Phenixdu59 le 18/09/2004 18:51:55

et ensuite je met le code ?

Commentaire de larion le 18/09/2004 19:18:46

Je ne comprends pas bien la question.
De quel code parles-tu ?
Sinon j'ai répondu (complètement) à ta question.

Commentaire de Phenixdu59 le 18/09/2004 19:19:40

ouais non c bon g réussi merci !

Commentaire de tanbeo le 21/02/2005 18:39:12

Bonjour,

Merci pour ce code que j'ai repris mais je ne trouve pas comment gérer le target à partir du menu !!!

Merci pour votre aide bien précieuse.

Commentaire de larion le 21/02/2005 21:11:55

On ne peut pas le gérer. C'est du javascript, pas du html ...

Commentaire de tanbeo le 22/02/2005 08:23:18

J'avais cru comprendre que l'on pouvait faire un NomFrame.Location.Href=
pour désigner la frame ?
Mais je n'ai pas réussi.
Merci tout de même.

Commentaire de larion le 22/02/2005 12:19:33

Pardon. J'avais mal compris.
Pour gérer les frames, il faut remplacer 'location.href' par
'parent.NameFrame.location.href'
'parent.frames[index].location.href'
'top.NameFrame.location.href'
'top.frames[index].location.href'

Si le menu est dans la frame 'haut' et que l'on veux mettre la page en 'bas' :
'parent.bas.location.href'

Commentaire de lengaigne le 22/04/2005 16:53:42

bonjour,
Est ce possible d'utiliser ce script pour faire un menu vertical ?
Que dois je changer ?
Merci bcp !!

Commentaire de larion le 25/04/2005 02:49:45

Bonjour,

J'avais un peu de temps : j'ai apporté les modifications nécessaire
pour mettre le menu en configuration vertical par une simple variable.

Commentaire de lengaigne le 25/04/2005 12:07:12

Merci beaucoup larion d'avoir passé du temps, apparemment ça marche nickel.
Si j'ai bien compris par rapport à l'autre script, là il faut que je le place directement dans ma page HTML et non pas dans un fichier menu.js.

Commentaire de larion le 25/04/2005 13:32:43

En fait, il y a 2 solutions :
- soit le recopier tel quel dans un fichier *.html
- soit recopier dans un fichier Menu.js mais sans les balises
<html>,<head>,<script> de début et
</script>,</body>,</html> de fin
Donc danc le() fichier *.html mettre simplement

<html>
...
<script language="JavaScript" src="Menu.js" type="text/JavaScript"></script>
...
</html>

J'ai fait une petite erreur dans l'exemple :
- j'ai oublier </head> et <body>

Commentaire de ekintza le 05/10/2005 16:12:08

bonjour,
j'utilise le script sur mon site http://www.ekintza.net/ j'ai réussi a l'installer facilement ce qui prouve que c'est un bon script, par contre j'ai un problème le menu reste ouvert et est assez dificile de le fermer c'est sans doute par ce que j'utilise des iframes , si vous avez une solution a mon problème je vous en serais trés reconnaissant et de toute façon je marquerai dans le code source de la page LA SOURCE DU SCRIPT...

merci de partager votre savoir...

Commentaire de desbat le 27/10/2006 16:55:54

bonjour !
Je l'ai installé ca marche super j'ai eu un peu de problème pour appeler le fichier de l'extérieur à cause des html>,<head>,<script> de début et
</script>,</body>,</html> de fin

Merci

Commentaire de dfrau le 14/01/2007 19:41:45

Bonjour,
Etant un novice en la matière, quelle commande faut il modifier pour que ce menu trés sympathique soit centré sur la page ?

Merci

Commentaire de melininialex le 24/10/2007 19:57:52

comment fais-t-on pour mettre ce code dans flash. Je veux faire ce menu déroulant mais mon site web est fait dans flash.

merci!!

Commentaire de arnouff le 09/11/2007 03:23:44

Bonjour a tous, je cherche et je tourne en rond... quelqu'un pourrait me dire de quelle maniere on doit s'y prendre pour ajouter les Liens de niveau 2 ?

Niveau 1  ----  Niveau1
                   |- Niveau 2a  -- b c.....

Merci!

Commentaire de alibe33 le 21/11/2007 10:37:04

Salut,

Comment faire pour que la couleur arrière "bgcolor ='#000000';" soit transparente ?
J'ai essayé de remplacer #000000 par transparent, mais zoby.
Par une variable ?

Commentaire de supercebb le 15/06/2008 23:24:14

Bonjour à tous,
j'ai une petite question..
comment fait on pour positionner le menu dans un tableau???
merci d'avance les gars ..
cebb

Commentaire de luludovicp le 25/01/2010 19:20:22

bonjour,

ou met on le target="_blank" ???

Commentaire de ensrabat le 11/03/2010 10:43:25

merci bien pour l'effort

 Ajouter un commentaire




Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Mars 2010
LMMJVSD
1234567
891011121314
15161718192021
22232425262728
293031    

Consulter la suite du CalendriCode

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,608 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales