Bonjour, je débute dans la creation d'un site internet. J'essaye de réaliser un menu déroulant horizontal avec des boutons créés sur photoshop pour personnaliser le menu. Ce qui donne pour le code :

<ul id="menu">

<td><a href=""><img src="Menu1_1.gif"onMouseOver="this.src='Menu1_2.gif'" onMouseOut="this.src='Menu1_1.gif"></a></td>

        
<td><a href=""><img src="Menu2_1.gif"onMouseOver="this.src='Menu2_2.gif'" onMouseOut="this.src='Menu2_1.gif'"></a>

		<ul>

<td><a href="#"><img src="SousMenu1_1.gif"onMouseOver="this.src='SousMenu1_2.gif'"onMouseOut="this.src='SousMenu1_1.gif'"></a></td>

<td><a href="#"><img src="SousMenu2_1.gif"onMouseOver="this.src='SousMenu2_2.gif'"onMouseOut="this.src='SousMenu2_1.gif'"></a></td>

</ul>

</td>
        
<td><a href=""><img src="Menu3_1.gif"onMouseOver="this.src='Menu3_2.gif'" onMouseOut="this.src='Menu3_1.gif'"></a>

<ul>

<td><a href="#"><img src="SousMenu1_1.gif"onMouseOver="this.src='SousMenu1_2.gif'"onMouseOut="this.src='SousMenu1_1.gif'"></a></td>

<td><a href="#"><img src="SousMenu2_1.gif"onMouseOver="this.src='SousMenu2_2.gif'"onMouseOut="this.src='SousMenu2_1.gif'"></a></td>
                       
</ul>

</td>

<ul>

<td><a href=""><img src="Menu4_1.gif"onMouseOver="this.src='Menu4_2.gif'"onMouseOut="this.src='Menu4_1.gif'"></a></td>

<td><a href=""><img src="Menu5_1.gif"onMouseOver="this.src='Menu5_2.gif'"onMouseOut="this.src='Menu5_1.gif'"></a>

 </ul>

 </td>
                
</ul>


#menu ul {
 margin:0;
 padding:0;
 list-style-type:none;
 text-align:center;
 }
#menu td {
 float:left;
 margin:auto;
 padding:0;
 background-color:black;
 }
#menu td a {
 display:block;
 width:100px;
 color:white;
 text-decoration:none;
 padding:5px;
 }
#menu td a:hover {
 color:#FFD700;
 }



Le code HTML fonctionne parfaitement, j'arrive bien à obtenir le changement de couleur au passage de la souris. Le code CSS je pense qu'il est correct.

Pour que le menu soit déroulant j'ai vu qu'il fallait rajouter un code Javascript et c'est à ce niveau où je ne comprend pas du tout et je sais pas comment faire pour obtenir ce résultat : http://dosimple.ch/articles/Menus-dynamiques/menuHorizontal.html

Du coup je reformule ma demande qui sera beaucoup plus précise. Quel est le code javascript que je dois appliquer pour obtenir le résultat souhaité ?

Merci
Modifié par Fanyyy974 (24 Nov 2010 - 09:26)
Tout comme toi je suis débutant, mais pense à utiliser les balises codes du forum quand tu créer un topic c'est plus lisible ça donnera plus envie de t'aider !

Peux tu préciser ton problème. "Ca ne marche pas du tout." C'est vague.
Bonjour et bienvenue parmi nous Smiley smile

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien "Aide" qui apparaît tout en haut du forum est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

upload/1-code.gif