Partage
  • Partager sur Facebook
  • Partager sur Twitter

Menu Dynamique

    14 juillet 2010 à 12:54:54

    Bonjour chère communauté,

    Je suis en pleine recherche pour créer un menu dynamique, mais pas n'importe lequel. N'ayant pas énormément de bases en Javascript pour être honnête, et n'ayant pas trouvé de menu dynamique s'adaptant à mon site, je demande votre aide ici. :)

    Tout d'abord, j'aimerais faire un menu dynamique de ce type-ci :

    Image utilisateur

    Comme vous le voyez, je voudrais qu'au passage de la souris, il y ait des liens juste en dessous correspondant au grand menu qui s'affichent.
    Je sais que c'est simple, mais j'ai cherché une bonne matinée, et je n'ai pas trouvé grand chose.

    Pour vous aider un peu plus, je vous propose le code de la page correspondante :

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
    
    <head>
    <title>Lor'Actu ~~ 100% Lorrain, 200% Actu !</title>
    <meta http-equiv="content-type" content="text/html; charset=windows-1252" />
    <link rel="stylesheet" media="screen" type="text/css" title="Design" href="style.css" />
    </head>
    
    <body>
    
    <!-- Entête -->
    <div id="EnteteHeader"></div>
    <table border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td class="header_menu_slogan"></td>
        <td class="header_menu_actualite">  </td>
        <td class="header_menu_annuaire"> </td>
        <td class="header_menu_blogs"> </td>
        <td class="header_menu_loractufreq"> </td>
        <td class="header_menu_loractuassoc"> </td>
      </tr>
    </table>
    <div id="SousEnteteMenuHeader">ici</div>
    
    <!-- Espace -->
    <div id="Espace"></div>
    
    <!--  Menu de Gauche -->
    <div id="MenuGauche">
      <table border="0" cellpadding="0" cellspacing="0">
        <tr><td class="MenuGauche_element1">&nbsp;</td></tr>
        <tr><td class="MenuGauche_Culture"><a href="#" style="display: block; height: 100%; width: 100%;"></a></td></tr>
        <tr><td class="MenuGauche_Loisirs"><a href="#" style="display: block; height: 100%; width: 100%;"></a></td> </tr>
        <tr><td class="MenuGauche_Tourisme"><a href="#" style="display: block; height: 100%; width: 100%;"></a></td></tr>
        <tr><td class="MenuGauche_Politique"><a href="#" style="display: block; height: 100%; width: 100%;"></a></td></tr>
        <tr><td class="MenuGauche_Economique"><a href="#" style="display: block; height: 100%; width: 100%;"></a></td></tr>
        <tr><td class="MenuGauche_Sports"><a href="#" style="display: block; height: 100%; width: 100%;"></a></td></tr>
        <tr><td class="MenuGauche_element2"></td></tr>
        <tr><td class="MenuGauche_element3"></td></tr>
        <tr><td class="MenuGauche_element4"></td></tr>
        <tr><td class="MenuGauche_element5"></td></tr>
        <tr><td class="MenuGauche_element6"></td></tr>
        <tr><td class="MenuGauche_element7"></td></tr>
        <tr><td class="MenuGauche_element8"></td></tr>
      </table>
    </div>
    
    <div id="MenuDroite">
    <table border="0" cellpadding="0" cellspacing="0">
        <tr><td class="MenuDroite_element1"></td></tr>
        <tr><td class="MenuDroite_element2"></td></tr>
        <tr><td class="MenuDroite_element3"></td></tr>
        <tr><td class="MenuDroite_element4"></td></tr>
        <tr><td class="MenuDroite_element5"></td></tr>
        <tr><td class="MenuDroite_element6"></td></tr>
        <tr><td class="MenuDroite_element7"></td></tr>
        <tr><td class="MenuDroite_element8"></td></tr>
        <tr><td class="MenuDroite_element9"></td></tr>
      </table>
    </div>
    
    <div id="ContenuPrincipal"><h3>Welcome</h3>
          <p> Lorem ipsum dolor sit amet, consectetur adipiscing   elit. Praesent tristique varius ante. Cras venenatis, lectus sit amet   tristique convallis, nibh ante sollicitudin elit, at molestie metus   lacus a leo. Etiam nisl nisl, eleifend sed, feugiat a, molestie vitae,   ante. </p>
          <p><strong>Nam posuere, diam id   varius egestas, metus nibh commodo libero, sit amet rhoncus sapien elit   vitae mi. Etiam interdum diam vel tortor. Nulla facilisi. Donec eu   felis. Sed euismod imperdiet diam. In hac habitasse platea dictumst.   Vivamus in neque molestie eros volutpat accumsan. Nulla eu lectus.   Quisque bibendum.  							Integer quis enim. Aliquam eleifend ornare turpis. Nunc sed   neque. In quam sem, malesuada ut, accumsan vitae, mattis in, ligula.</strong></p>
      <p>Duis ullamcorper porttitor ligula. Donec   nisl. In velit. Donec libero metus, interdum nec, tempor et, iaculis at,   arcu. Sed laoreet rutrum mi. Aenean rutrum accumsan massa. Etiam   lacinia congue pede. Donec pharetra, quam ornare sollicitudin   consectetur, leo urna condimentum est, at volutpat nisi urna ut est.   Aenean euismod nibh in ligula. Morbi imperdiet ultrices risus. Donec in   neque. Suspendisse potenti. Quisque sodales arcu ac lorem.    Donec eu lectus in massa commodo port </p>
          <img src="http://www.kitsgratuits.com/templates-preview/template-107/images/img.gif" alt="" />
          <p> Duis ullamcorper porttitor ligula. Donec nisl. In   velit. Donec libero metus, interdum nec, tempor et, iaculis at, arcu.   Sed laoreet rutrum mi. Aenean rutrum accumsan massa. Etiam lacinia   congue pede. Donec pharetra, quam ornare sollicitudin consectetur, leo   urna condimentum est, at volutpat nisi urna ut est. Aenean euismod nibh   in ligula. Morbi imperdiet ultrices risus. Donec in neque. Suspendisse   potenti. Quisque sodales arcu ac lor</p>
    </div>
    <div id="BottomPrincipal"></div>
    
    </body>
    </html>
    


    Le grand menu où la souris passera est celui-ci :

    <table border="0" cellpadding="0" cellspacing="0"> <tr> <td class="header_menu_slogan"></td> <td class="header_menu_actualite"> </td> <td class="header_menu_annuaire"> </td> <td class="header_menu_blogs"> </td> <td class="header_menu_loractufreq"> </td> <td class="header_menu_loractuassoc"> </td> </tr> </table>

    et voici la ligne où je veux que les liens correspondants à chacun de ces grands menu apparaissent :

    <div id="SousEnteteMenuHeader">ici</div>

    --

    Je vous remercie d'avance de votre aide, et j'espère que je vous ai donné toutes les informations qu'il faut. :)

    Cordialement,
    Marcucio
    • Partager sur Facebook
    • Partager sur Twitter

    Menu Dynamique

    × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
    × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
    • Editeur
    • Markdown