Personne ne peux pas m'aider pour mon menu

gaya_102 -
gaya_102 - 2 mars 2009 à 17:52

Bonjour,
personne ne veux pas m'aider pour mon menu déroulant en css. Ca me bloque et je ne peux pas avancer.
J'ai déjà eu un peu d'aide mais j'y suis pas encore arrivé.

Afficher la suite

A voir également:

Personne ne peux pas m'aider pour mon menu
Menu déroulant excel - Guide
Canon quick menu - Télécharger - Utilitaires
Menu demarrer ne s'affiche pas - Guide
Menu démarrer - Guide
Windows 11 menu démarrer classique - Guide

2 réponses

Réponse 1 / 2

bissdebrazza Messages postés 2886 Statut Contributeur 712

salut!
c'est quoi exactement ton problème?

gaya_102

Merci de ton aide

voila la page

http://www.sandrineetgwen.fr/emelinejourj.html

voila le code

je me suis renseigné sur le net pour un menu déroulant en css. J'ai trouvé et essayé de l'appliquer à mon site. J'ai du faire une erreur quelque part car ca ne marche pas.

Code HTML :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Jour J</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="design_emeline4.css" />
<script type="text/javascript" src="menu.js"></script>
<script language="JavaScript" src="mm_menu.js"></script>

</head>

<body>


<div id="rubrique">
<div>

<img src="image/emeline_rub.jpg" style="float: left">
<ul id="menuderoulant">
<li>
<a href="emelinepresentation.html"><img src="image/presentation_rub_off.jpg" style="float: left" alt="image/presentation_rub_on.jpg" class="rollOver" /></a>
<ul class="sousmenu">
<li><a href="lesmariees.html">Les mariées</a></li>
<li><a href="lesparents.html">Les parents des mariées</a></li>
<li><a href="lesfrangins.html">les frangins et frangines</a></li>
<li><a href="lestemoins.html">Les témoins</a></li>
</ul>

<img src="image/oiseau1_rub.jpg" style="float: left">
<li>
<a href="emelinejourj.html"><img src="image/jourj_rub_off.jpg" alt="image/jourj_rub_on.jpg" style="float: left" class="rollOver" /></a>
<ul class="sousmenu">
<li><a href="lesmariees.html">Les mariées</a></li>
<li><a href="lesparents.html">Les parents des mariées</a></li>
<li><a href="lesfrangins.html">les frangins et frangines</a></li>
<li><a href="lestemoins.html">Les témoins</a></li>
</ul>
</li>
<img src="image/oiseau2_rub.jpg" style="float: left">
<li>
<a href="infospratiques.html"><img src="image/infospratiques_rub_off.jpg" alt="image/infospratiques_rub_on.jpg" style="float: left" class="rollOver" /></a>
<ul class="sousmenu">
<li><a href="lesmariees.html">Les mariées</a></li>
<li><a href="lesparents.html">Les parents des mariées</a></li>
<li><a href="lesfrangins.html">les frangins et frangines</a></li>
<li><a href="lestemoins.html">Les témoins</a></li>
</ul>
</li>
<img src="image/oiseau3_rub.jpg" style="float: left">
<a href="contact.html"><img src="image/contact_rub_off.jpg" alt="image/contact_rub_on.jpg" class="rollOver" style="float: left" /></a>
<img src="image/oiseau4_rub.jpg" style="float: left">
</ul>
</li>
</div>

<div>

</div>

<script type="text/javascript">
var imgs = document.getElementsByTagName('img');

for (var i = 0; i < imgs.length; i++)
{
if (imgs[i].className == 'rollOver')
{
imgs[i].onmouseover = (function() { var a = this.src; this.src = this.alt; this.alt = a; });
imgs[i].onmouseout = (function() { var a = this.src; this.src = this.alt; this.alt = a; });
imgs[i].className = '';
}
}

</script>
</body>
</html>

Code CSS :

body
{
background-color: #FBE3DE;
}
img {
border:0;
}

#unite
{
width: 980px;
height: 542px;
margin: auto;
background-image : url("image/fond_emeline.jpg");
background-repeat: no-repeat;
border :2px solid black;
}

#rubrique
{
width: 980px;
height: 542px;
margin: auto;
background-image : url("image/fond_rubrique.jpg");
background-repeat: no-repeat;
border :2px solid black;
}

.menu
{
width: 980px;
height: 126px;
}
.en_tete
{
width: 980px;
height: 173px;
}
.bas_page
{
width: 980px;
height: 243px;
}

/* pour le menu deroulant */

#menuderoulant
{
width: 644px;
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
}

#menuderoulant li
{
float: left;
margin: 0;
padding: 0;
border: 0;
}

#menuderoulant .sousmenu
{
list-style-type: none;
margin: 0;
padding: 0;
border: 0;background: yellow;
}

#menuderoulant .sousmenu li
{
margin: 0;
padding: 0;
border: 0;
}

#menuDeroulant li a:link, #menuDeroulant li a:visited
{
display: block;
height: 1%;
color: #FFF;
background: #3B4E77;
margin: 0;
padding: 4px 8px;
border-right: 1px solid #fff;
text-decoration: none;
}
#menuDeroulant li a:hover { background-color: #F2462E; }
#menuDeroulant li a:active { background-color: #5F879D; }

#menuDeroulant .sousMenu li a:link,
#menuDeroulant .sousMenu li a:visited
{
display: block;
color: #FFF;
margin: 0;
border: 0;
text-decoration: none;
}
#menuDeroulant .sousMenu li a:hover
{
background-image: none;
background-color: #F2462E;
}

Réponse 2 / 2

bissdebrazza Messages postés 2886 Statut Contributeur 712

Salut!
A mon avis,il y a des styles que tu n'as pas appliqué!

#menuderoulant li
{
float: left;
margin: 0;
padding: 0;
border: 0;
}

#menuderoulant .sousmenu
{
list-style-type: none;
margin: 0;
padding: 0;
border: 0;background: yellow;
}

#menuderoulant .sousmenu li
{
margin: 0;
padding: 0;
border: 0;
}

#menuDeroulant li a:link, #menuDeroulant li a:visited
{
display: block;
height: 1%;
color: #FFF;
background: #3B4E77;
margin: 0;
padding: 4px 8px;
border-right: 1px solid #fff;
text-decoration: none;
}
#menuDeroulant li a:hover { background-color: #F2462E; }
#menuDeroulant li a:active { background-color: #5F879D; }

#menuDeroulant .sousMenu li a:link,
#menuDeroulant .sousMenu li a:visited
{
display: block;
color: #FFF;
margin: 0;
border: 0;
text-decoration: none;
}
#menuDeroulant .sousMenu li a:hover
{
background-image: none;
background-color: #F2462E;
}

Il faut bien les utiliser!

gaya_102

en fait je débute et je ne comprend pas tout
Quel style je n'ai pas utilisé?
Car j'avoue que cette partie je ne la comprend pas

#menuderoulant .sousmenu
{
list-style-type: none;
margin: 0;
padding: 0;
border: 0;background: yellow;
}

#menuderoulant .sousmenu li
{
margin: 0;
padding: 0;
border: 0;
}

#menuDeroulant li a:link, #menuDeroulant li a:visited
{
display: block;
height: 1%;
color: #FFF;
background: #3B4E77;
margin: 0;
padding: 4px 8px;
border-right: 1px solid #fff;
text-decoration: none;
}
#menuDeroulant li a:hover { background-color: #F2462E; }
#menuDeroulant li a:active { background-color: #5F879D; }

#menuDeroulant .sousMenu li a:link,
#menuDeroulant .sousMenu li a:visited
{
display: block;
color: #FFF;
margin: 0;
border: 0;
text-decoration: none;
}
#menuDeroulant .sousMenu li a:hover
{
background-image: none;
background-color: #F2462E;
}

gaya_102 > gaya_102

j'ai dit quelque chose qui ne fallait pas?

Discussions similaires

TV continental Edison bloqué sur le menu

menu caché

Mon PC marque press the esc key for startup menu

Comment activer le Bluetooth sur une TV Samsung ?

Déblocage du mode hôtel Philips 20HF5234/10

Personne ne peux pas m'aider pour mon menu

2 réponses

Votre réponse

Discussions similaires

Newsletters