Imprimer la Page | Fermez la fenêtre

integrer un menu deroulant horizontal

Imprimé depuis: Forum openElement
Categorie:

openElement


Nom du Forum: Scripts pour votre site
Description du Forum: Exemple de scripts utilisables dans les blocs de codes
URL: https://forums.openelement.uk/fr/forum_posts.asp?TID=20105
Date: 20 Avr 2024 à 05:00
Version logiciel: Web Wiz Forums 12.04 - http://www.webwizforums.com


Sujet: integrer un menu deroulant horizontal
Posté par: lableue
Sujet: integrer un menu deroulant horizontal
Posté le: 01 Nov 2014 à 12:50
bonjour
comment peut on intégrer un menu deroulant horizontal (j'ai écrit le css adéquat) mais je ne sais pas l'intégrer dans mon site en cours d'élaboration. merci.



Réponses:
Posté par: brolysan
Posté le: 01 Nov 2014 à 14:17
peux tu donner ton code css?


Posté par: lableue
Posté le: 01 Nov 2014 à 16:49
voici mon code


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr">
<head>
     <title>Menu horizontal déroulant</title>
     <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
     <link rel="stylesheet" href="style.css" type="text/css" />
     <script type="text/javascript" src="menu.js"></script>
</head>
<body>
<div id="centrer">


<div id="menu">
     <ul>          
        <li onmouseover="montre('smenu6',true);" onmouseout="montre('smenu6',false);">nom menu6
        <ul id="smenu6">
                    <li onmouseover="montre('smenu61',true);" onmouseout="montre('smenu61',false);"><a href="#">contact</a>
                    </li>
                 </ul>
        </li>
       
       <li onmouseover="montre('smenu5',true);" onmouseout="montre('smenu5',false);">nom menu5<ul id="smenu5">
                    <li onmouseover="montre('smenu51',true);" onmouseout="montre('smenu51',false);"><a href="#">nom smenu 51</a>
                    </li>
                    <li onmouseover="montre('smenu52',true);" onmouseout="montre('smenu52',false);"><a href="#">nom smenu 52</a>
                    </li>
               </ul>
          </li>
      <li onmouseover="montre('smenu4',true);" onmouseout="montre('smenu4',false);">nom menu 4</li>     
     
      <li onmouseover="montre('smenu3',true);" onmouseout="montre('smenu3',false);">nom menu 3
           <ul id="smenu3">
                    <li onmouseover="montre('smenu31',true);" onmouseout="montre('smenu31',false);"><a href="#">nom smenu 31</a>
                    <li><a href="#">nom smenu 32</a></li>
                    <li><a href="#">nom smenu 33</a></li>
               </ul>               
          </li>
      <li onmouseover="montre('smenu2',true);" onmouseout="montre('smenu2',false);">nom menu2
           <ul id="smenu2">
                    <li><a href="#">nom smenu 21</a></li>

                    <li><a href="#">nom smenu 22</a></li>
                    <li><a href="#">nom smenu 23</a></li>
     
                    </li>
               </ul>               
          </li>     
          <li onmouseover="montre('smenu1',true);" onmouseout="montre('smenu1',false);">nom menu1
               <ul id="smenu1">
                    <li onmouseover="montre('smenu11',true);" onmouseout="montre('smenu11',false);"><a href="#">nom menu11</a>
                         
                    </li>
                    <li><a href="#">nom menu12</a></li>
                    <li onmouseover="montre('smenu13',true);" onmouseout="montre('smenu13',false);"><a href="#">nom menu13</a>
                         
                    </li>
               </ul>
          </li>

     </ul>     
</div>     
</div>     
</body>
</html>



Imprimer la Page | Fermez la fenêtre

Forum Software by Web Wiz Forums® version 12.04 - http://www.webwizforums.com
Copyright ©2001-2021 Web Wiz Ltd. - https://www.webwiz.net