Forum d'aide création graphique / [Résolu] Menu Déroulant

daxulan · 09-01-2010 20:38:06

Bonjour, j'aimerais faire un menu déroulant en dessous d'une de mes rubrique (comme ceci http://www.barbok.fr la rubrique equipement) ces comme sa que j'aimerais que le menu se déroule =D mais je n'y arrive pas alors je vous demande de l'aide
Merci a Vous =)

Rem74 · 08-02-2010 21:34:28

Code:

<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>

daxulan · 27-02-2010 20:11:01

J'aimerais Savoir comment je peux adapter ce menu au miens voila mon site ====> http://www.daxulan.net

daxulan · 28-02-2010 15:52:10

UP svp smile

Maude · 28-02-2010 16:54:10

Bonjour,

Essayé comme ceci :

Ce code est à mettre entre les balises head :

Code:

<!--
function showHide(thingId) {
var element=document.getElementById(thingId);
if (element.style.display=='') element.style.display='none';
else element.style.display='';
}       
//-->

ensuite pour votre menu :

Code:

<div class="haut_navigation"></div><!-- MEnu -->
<div class="fond_menu">
<ul id="navigation">    
<a href="index.html">- Accueil</a>
<a href="Daxulan.html">- Daxulan</a>
<a href="Video.html">- Vidéo</a>
<a href="Images.html">- Images</a>
<a href="Dofus.html">- Dofus</a>

<a href="javascript:showHide('menu');">- Guilde</a>     
<div id="menu" style="display:none;">
<a href="Musique.html">- Musique ! </a>
<a href="Mesmules.html">- Mes Mules </a></div>     
<a href="Teleendirect.html">- Télé En Direct </a>
<a href="Contact Moi.html">- Contact Moi</a>
</ul></div>
     
<div class="bas_menu"></div> <!-- Fin MEnu -->

Le css remplacez ceci :

Code:

ul li a, ul li  {display: block;color: #fff;outline:none;text-align:center; text-decoration: none;font:12px "trebuchet ms";list-style-type:none;line-height:12px;margin:0 auto 0 auto;}

Par :

Code:

ul li a, ul li, ul a  {display: block;color: #fff;outline:none;text-align:center; text-decoration: none;font:12px "trebuchet ms";list-style-type:none;line-height:12px;margin:0 auto 0 auto;}

daxulan · 28-02-2010 17:01:43

Je vais essayer merci , je vous dit quoi ... dé que test

Maude · 28-02-2010 17:10:51

J'ai édité le code du menu entre temps.
J'ai testée et ca fonctionne le seul hic c'est que je n'arrive pas à le faire fonctionner avec les balises <li>

daxulan · 28-02-2010 17:13:01

J'ai essayer mais je n'y arrive pas .... j'ai changé me style et fais ce que vous avez dit , mais aucun effets... voila le code du debut(a partir du cod e a mettre dans head) de page et du menu...

Code:

<!--
function showHide(thingId) {
var element=document.getElementById(thingId);
if (element.style.display=='') element.style.display='none';
else element.style.display='';
}       
//-->
<link href="style.css"    title="Défaut" rel="stylesheet" type="text/css" media="screen" />  
<!-- Transparence png sous IE6 -->
<!--[if lte IE 6]>
<style type="text/css" media="screen">
#header    {background: none;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/header.png", sizingMethod="scale");};
#contenu {background: none;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/fond_contenu.png", sizingMethod="scale");};
#pied      {background: none;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/pied.png", sizingMethod="scale");};    
.menu_haut   {background: none;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/menu_haut", sizingMethod="scale");};
.menu_fond {background: none;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/menu_fond.png", sizingMethod="scale");};
.menu_bas     {background: none;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/menu_bas.png", sizingMethod="scale");};     
.cadre_haut   {background: none;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/cadre_haut", sizingMethod="scale");};
.cadre_fond {background: none;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/cadre_fond.png", sizingMethod="scale");};
.cadre_bas     {background: none;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/cadre_bas.png", sizingMethod="scale");};          
</style>
<![endif]-->  

</head>
<body>
<div id="conteneur"> 
<div id="header"></div>
<div id="contenu"><!-- CONTENU -->    
<div id="left"><!-- COLONNE DE GAUCHE -->  
<img src="images/titre.png" alt=""/>
<a href="index.html"><img src="images/accueil.png" alt=""/></a>


<div class="haut_navigation"></div><!-- MEnu -->
<div class="fond_menu">
<ul id="navigation">    
<li><a href="index.html">- Accueil</a></li>
<li><a href="Daxulan.html">- Daxulan</a></li>
<li><a href="Video.html">- Vidéo</a></li>
<li><a href="Images.html">- Images</a></li>
<a href="javascript:showHide('menu');">Rubrique</a>
<div id="menu" style="display:none;">
<li ><a href="" title="">Rubrique</a></li>    
<li ><a href="" title="">Rubrique</a></li>    
<li ><a href="" title="">Rubrique</a></li>    
<li ><a href="" title="">Rubrique</a></li>    
<li ><a href="" title="">Rubrique</a></li>
</div>
<li><a href="Lien Utile.html">- Guilde</a></li>
<STRIKE><li><a href="Musique.html">- Musique ! </a></li></STRIKE>
<STRIKE><li><a href="Mesmules.html">- Mes Mules </a></li></STRIKE>
<li><a href="Teleendirect.html">- Télé En Direct </a></li>
<li><a href="Contact Moi.html">- Contact Moi</a></li>
</ul></div>

En esperant trouver le probleme

daxulan · 28-02-2010 17:16:12

J'ai remplacé le menu par votre code et toujours rien =S

Merci de l'aide que vous m'apporter

Maude · 28-02-2010 17:18:34

Pourriez-vous faire les modifs et envoyer le tout en ligne que je puisse voir le résultat?

Edit : L'envoyer en ligne = sur votre ftp

daxulan · 28-02-2010 17:24:55

a ok merci ^^'

Voila ... http://daxulan.olympe-network.com/test.html

EDIT : 30 secondes svp j'ai oublier le style.... STYLE en ligne sayais

Dernière modification par daxulan (28-02-2010 17:30:42)

Maude · 28-02-2010 17:29:42

C'est de ma faute je me suis trompée sad

Pour le code entre les balises head :

Code:

<script type="text/javascript">
<!--
function showHide(thingId) {
var element=document.getElementById(thingId);
if (element.style.display=='') element.style.display='none';
else element.style.display='';
}       
//-->
</script>

Edit : Après test cela fonctionne normalement.

daxulan · 28-02-2010 17:32:44

PAs grave du tout ^^' et sa marche ! Merci Bcp wink

Kitgraphiquegratuit choisi bien ces modo smile

Maude · 28-02-2010 17:33:39

Tant mieux smile

bonne continuation à vous.

#1 09-01-2010 20:38:06

[Résolu] Menu Déroulant

#2 08-02-2010 21:34:28

Re: [Résolu] Menu Déroulant

Code:

#3 27-02-2010 20:11:01

Re: [Résolu] Menu Déroulant

#4 28-02-2010 15:52:10

Re: [Résolu] Menu Déroulant

#5 28-02-2010 16:54:10

Re: [Résolu] Menu Déroulant

Code:

Code:

Code:

Code:

#6 28-02-2010 17:01:43

Re: [Résolu] Menu Déroulant

#7 28-02-2010 17:10:51

Re: [Résolu] Menu Déroulant

#8 28-02-2010 17:13:01

Re: [Résolu] Menu Déroulant

Code:

#9 28-02-2010 17:16:12

Re: [Résolu] Menu Déroulant

#10 28-02-2010 17:18:34

Re: [Résolu] Menu Déroulant

#11 28-02-2010 17:24:55

Re: [Résolu] Menu Déroulant

#12 28-02-2010 17:29:42

Re: [Résolu] Menu Déroulant

Code:

#13 28-02-2010 17:32:44

Re: [Résolu] Menu Déroulant

#14 28-02-2010 17:33:39

Re: [Résolu] Menu Déroulant

Pied de page des forums