L'éditeur JavaScript
Visiteur non-identifié | Identifiez-vous | Devenir membre
Code perdu ? | Combien de visiteurs sur votre site ?
Rechercher :
Page d'accueil
     Home Page

JavaScript
     Tous les scripts
     Proposer un script
     Recherche de script
     AJAX
     Cours de JavaScript
     Liste de discussion
     Forums

Services :
     CountUs
     myCircle
     ClickInText
     XooIt

Trucs et astuces :
     HTML / CSS
     PHP / MySQL
     Réferencement
     Graph / Présentation
     Toutes les astuces
     Ajouter un article

MailingList :
113693 abonnés

Annuaire webmaster :      Hebergement web
     Referencement
     Sites webmasters
     XHTML - CSS2
     PHP
     Affiliation - Pub
     FAI

     Annuaire webmaster

Ressources pour webmasters :
     Kit graphique
     Foire aux questions
     Les membres
     Devenir annonceur
     Faire un lien
     Contact

Partenaire :
     Compteur live
     Créer un forum
     Le PHP facile
     Comscripts
     Liens sponsorisés
     Page Rank
     Gifs animés, f...
     Easy-script.com
     Le village de ...
     La cuisine de ...
     Web creation ...
     Créer son site...
     Azote.org - no...
     Les kits graph...
     Electroniq...
     Poésie et cita...
     Les autres
     Votre site ici ?


Menu horizontal dynamique multicolore

Script posté par :

rf92
Vous aussi, postez vos scripts en cliquant ici.


Description

Ce menu est basé sur le menu dynamique horizontal(http://www.editeurjavascript.com/scripts/scripts_navigation_1_111.php).
La seule différence réside dans l'utilisation de plusieurs couleurs pour les en-têtes de menus et les catégories qui les composent, contrairement au script d'origine où les couleurs sont partout identiques.


Compatibilité :

 FireFox : Toutes versions
 Mozilla : 1 et +
 Netscape Navigator : 6 et +
 Internet Explorer : 4 et +
Ce script utilise le DHTML


Chiffres :

Date de création : 17/09/2006
Dernière modif : 20/09/2006
Visites de la page : 75060
Envois par mail : 4738


Dernière modification du script :

Le 20/09/2006 : Passage du script dans un fichier .js
>> Voir toutes les modifications effectuées sur ce script.


Exemple :




Le code :

Entre <BODY> et </BODY> :


Dans un fichier nommé ejs_menu_multicolor.js placé dans le même repertoire que votre page :

Si vous ne savez pas comment créer le fichier ejs_menu_multicolor.js, demandez a recevoir le script par email, il vous sera alors envoyé en pièce jointe ! Sinon, consultez la FAQ du site.

Services email :

Je désire recevoir ce script par email
Je désire recevoir un email en cas de modification de ce script
Je désire m'abonner à la newsletter de l'éditeur JavaScript


Les annotations des visiteurs :

De llx_lvlick_xll - le 13-12-2006
Bonjour, script super je trouve, mais seul prob, comment fait on si on veut mettre plusieurs menu à différente place, car en creer un 2eme .js et en changant le script sur l'index ca change rien, c'est le meme js qui arrive pour les 2. Pouvez vous m'aider svp...
De #:-{)% - le 20-02-2007
a=true dans la fonction pop(msg,pos) peut et devrait être supprimé.
De #:-{)% - le 21-02-2007
JC, STP, A NE PAS METTRE DANS LES ANNOTATIONS
rf92 a 1 blême pour inséré 1 annotation cf: http://www.editeurjavascript.com/forum/topic,14,42003,0.html
De pacopau - le 30-04-2007
Bonjour.

A l'execution de ce script menu horizontal multicolore, il apparaît après la dernière option un trait noir dans l'alignement de la bordure inférieure du menu. Comment la supprimer, car ce script m'intéresse beaucoup.

Merci d'avance

pacopau

De pomme jaune - le 29-12-2007
Bonjour,

Pour ma pars, je n'arrive à centrer le menu dans ma page. je pense que je dois remplacer le mot "absolute" par quelques choses mais je ne sait pas quoi. Un peu d'aide serait la bienvenue.
Cordialement
De ch_m_d - le 01-02-2008
je vous remercie pour ce menu il me plait bien j'aimerai bien l'utilisée

mais comment contourner

document.onclick = kill;

et ne pas obligée l'utilisateur a clicker sur le document pour que le deuxieme tableau soit invisible
De levelkro - le 20-04-2008
Ce script est très flexible, malgré que j'approuve pas la mise en forme du tableau principal, uen fois modifier il peu devenir bien plus beau et performant, meme sans connaitre le JavaScript.

Je l'utilise comme menu du GroupeWare que j'ai eu a faire pour la compagnie pourlaquel je travail, et sa ma value un bonus!

Et sa marche très bien avec PHP pour créé le menu dynamiquement.
De Nodra - le 21-05-2008
je sui nouvelle et je n'y conné trop rien grand chose
quelqun pourrais m'indiquer comment créer un fichier .js?
merçi
De compat - le 04-07-2008
très bien le script
2 probs
1_on ne peut pas rééditer le script dans la pg., ou alors c'est le même
2_avec firefox ça marche à moitié, les sous menus restent à gauche au lieu de suivre les menus
Help! peut-être??
De netmuse - le 30-08-2008
Bonjour à tous,
Je suis nouveau inscrit mais je navigue sur ce site depuis longtemps, donc soyez indulgent please!

JJ'ais due chercher un moment une solution pour améliorer le script, et je l'ai ameliorer de 2 façons:
- Pour FF, le menu est plus bas, il ne passe plus en dessous (voyez avec tous vos navigateur à l'adresse www.netmuse.fr)
- Pour le visuel, le SOUS menu se retrouve dans la même couleur que le MENU surlignée.

Je bosse sur un formulaire pour modifier le contenu, un formulaire ou on choisi les couleur sur une palette, ou on ajoute des menus en ajoutant d'autres champs....


MAIS EN ATTENDANT, VOICI MES AMÉLIORATIONS:

---------------------------------
document.write('<style type="text/css">');
document.write('.popper { POSITION: absolute; VISIBILITY: hidden; z-index:3; }')
document.write('#topgauche { position:absolute; z-index:10; }')
document.write('A:hover.ejsmenu {color:#FFFFFF; text-decoration:none;}')
document.write('A.ejsmenu {color:#FFFFFF; text-decoration:none;}')
document.write('</style>')
document.write('<div style="position:relative;height:25"><DIV class=popper id=topdeck></DIV>');
---------------------------------
function pop(msg,pos,ssmenu)
{
skn.visibility = "hidden";
skn.left = pos;
var content ="<TABLE BORDER=0 style=\"margin-top: 25px;\" CELLPADDING=0 CELLSPACING=0 WIDTH=150><TR><TD><TABLE WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=1>";
pass = 0
while (pass < msg.length)
{
content += "<TR><TD BGCOLOR="+ssmenu+" onMouseOver=\"this.style.background='"+zgcolor[pass]+"'\" onMouseOut=\"this.style.background='"+ssmenu+"'\" HEIGHT=20><FONT SIZE=1 FACE=\"Verdana\"> "+msg[pass]+"</FONT></TD></TR>";
pass++;
}
---------------------------------
VOILA, il faut naturelement remplacer ces extraits dans votre fichier js

@+
De netmuse - le 30-08-2008
ET J'OUBLIAIS!

Il faut envoyer les infos sur la couleur, dans chaque menu (fin du js), il faut comleter comme ci-dessous:

---------------------
document.write('<TD WIDTH=100 ALIGN=center BGCOLOR='+bgcolor+' onMouseOver="this.style.background=\''+bgcolor2+'\';pop(zlien[0],0,bgcolor2)" onMouseOut="this.style.background=\''+bgcolor+'\'"><A onClick="return(false)" onMouseOver="pop(zlien[0],0)" href=# CLASS=ejsmenu><FONT SIZE=1 >ECOUTE</FONT></a></TD>')
-----------------------------

IL FAUT JUSTE DANS CES LIGNES MODIFIER CECI:
pop(zlien[0],0,bgcolor2)

En completant par la couleur que doit prendre le SOUS menu, donc les m^m donnes que this.style.background=\''+bgcolor2+'

:

bgcolor2
bgcolor3
bgcolor4
...
De FireKing - le 13-12-2008
Bonjour, moi également j'aime ce script mais en le modifiant je me suis confronté à un problème qui est le suivant:

J'ai ajoputé des cases dans le bordereau principal, (j'ai en tout 14 cases en haut dfe ma page) mais l'orsque je déroule les sous-menus, ils ne s'affiches pas exactement en desous de la case du bordereau correspondant.
Comment puis-je régler ça ?

Et autre problème, je n'arrive pas à suprimer la ligne qui s'affiche lorsque je déroule la dernière case.

Si quelqu'un pourrait m'aider se serai extra.

Merci d'avance
De roxi84-13 - le 03-05-2009
Tout en bas de ta page js, il faut que tu modifie les mesure des "document.write" il faut que tes "pop(zlien[0],0)" sois aux meme mesure pour être l'une sous l'autre.
Le 1er est à zero.
Aprés, trouve la mesure du deuxiéme, et une fois que tu as trouvé la mesure de ta 1ere case, il suffit de rajouter cette somme à la 2eme case, chez moi ça donne : (je met que les mesures, pas tt le java)

pop(zlien[0],0) - pop(zlien[0],0)
pop(zlien[1],140) - pop(zlien[1],150)
pop(zlien[2],280) - pop(zlien[2],200)
pop(zlien[3],420) - pop(zlien[3],350)

Comme tu vois, 140+140 = 280
Et celui du dessous vas de 50 en 50.
C'est plus simple que ce qu'il n'y parrait tkt lol
De taram77 - le 05-10-2009
J'ai trouvé un morceau de code qui permet de cacher automatiquement les sous menus.
document.write('<div style="position:relative;height:30" id="hidemenu" onmouseover="clearTimeout(this.setattente);this.bye=false;" onmouseout="if (this.bye) {kill();} else {this.bye=true;this.setattente= setTimeout(\'hidemenu.onmouseout()\',50);}"><DIV class=popper id=topdeck></DIV>');

le problème est que je rencontre avec firefox 3.5 des réactions aléatoires alors que tout fonctionne avec IE et OPERA.Avez-vous une idée du problème; Merci
De minoula2006 - le 11-12-2009
ca ma vraiment plus ce menu , mais j'ai essayer d ele faire dans mon site et j'ai afficher la page avec firefox ça marche à moitié, les sous menus restent à gauche au lieu de suivre les menus
Help!
c tréééééééééés urgent SVP
Merci ;)
De flibustier - le 14-12-2009
Bonjour,

je voudrais positionner ce manu sur une image, est ce possible ?

J'ai bien essayé avec :

document.write('<div style="position:relative;left:132;top:391;height:25">

Mais j'ai soit l'image ou soit le menu mais pas les deux.

Dois je jouer avec le style visibility ?

Kk1 a t-il une idée ?

Merci,

>> Poster une annotation sur ce script






compteur gratuit
actuellement en ligne

    PUBLICITE



     ANNUAIRE WEBMAST.
Néo Domaine
Enregistrement, Tansfert et Gestion de nom de domaine Internet Parking DNS + redirection web + redirection mail INCLUS ! Transfert de Registrar GRATUIT !
http://www.neodomaine.com/
Cat : Nom de domaine
Voir l'annuaire webmaster


     LES SCRIPTS :
78 à éditer
68 à copier/coller
247 des membres
2580 sur le web
>> Tous les scripts

     LES MEMBRES :
61315 membres
7205 comptes CountUs
1721 comptes myCircle

     LES FORUMS :
14 forums
39942 topics
190892 messages
>> Les forums

    SONDAGE

Vous avez un blog ou site classique ?
Un blog
Un site classique
Les deux !
La mini-astuce "HTML / CSS" du jour par fred
L'attribut media vous permet de définir une feuille de style différente selon le média de sortie : affichage dans un navigateur (media="screen"), impression (media="print"), impression en braille (media="embossed"), etc. Syntaxe : <link rel="stylesheet" media="screen" href="style.css">
Proposer votre mini-astuce | Archives des mini-astuces
© 1999-2010 EJS - Tous droits réservés | CNIL N° 844440 | 19/03/2010 19:52:18 | Design by | Gen. en 0.614 sec.