[Résolu] Menu vertical déroulant

Question

kilik2049

24 Jul 2008 à 15:02

Salut à vous!
Voulant un menu vertical déroulant pour mon site, j'ai trouvé votre tuto (qui est très bien au passage!). Bon jusque là, pas de problème.
Je créée une page php, je met le html et le script en javascript, je l'include dans mes pages, je fais le CSS donné et l met à mon gout.
Tout marche, seulement voilà: le texte de mes pages devient un lien vers une page du site!!
Alors, j'ai regardé, et je pensait que mon problème vient d'une divergence des feuilles de style (car le menu en utilise une, et le reste du site une autre). Mais même en les réunissant, j'ai toujours un texte-lien!!

Voilà mes codes:

Menu

<!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>Blind Tears - The Official Website!</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	   <meta name="author" content="Dark Simoon"/>
	   <meta name="keywords" content="Blind Tears, Metal, metal, heavy, Dark Simoon, Frankette, Bat'Gland, Taillefine, 
	   Chtouf, groupe, band, Le Mans, Le mans, le mans, le Mans"/>
	   <meta name="Description" content="Le site du groupe de metal manceau Blind Tears"/>
	   <meta name="robots" content="index"/>
	   <link rel="stylesheet" media="screen" type="text/css" title="Design" href="new 6.css" />
	   <link rel="icon" type="image/png" href="favicon.ico" />
	   <script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=10; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}
//-->
</script> 


	</head>
   <body>


<div id="corpsmenu">

<dl id="menu">
		<dt onmouseover="javascript:montre('smenu1');"><a href="index.php">Accueil</a></dt>

			</dd>	
			<dt onmouseover="javascript:montre('smenu2');" ><a href="bio.php">Biographie</dt>			
        <dt onmouseover="javascript:montre('smenu3');" ><a href="concert.php">Concerts</dt>				
        <dt onmouseover="javascript:montre('smenu3');" ><a href="groupe.php">Le groupe</dt>						
        <dt onmouseover="javascript:montre('smenu4');" ><a href="disco.php">Discographie</dt>					
        <dt onmouseover="javascript:montre('smenu5');" ><a href="chansons.php">Les chansons</dt>		
		<dt onmouseover="javascript:montre('smenu6');" ><a href="index.php">Multimédia</dt>
			<dd id="smenu6" onmouseover="javascript:montre('smenu6');" onmouseout="javascript:montre();">
				<ul>
					<li><a href="photo.php">Photos</a></li>
					<li><a href="video.php">Vidéos</a></li>
				</ul>
			</dd>	
			
        <dt onmouseover="javascript:montre('smenu7');" ><a href="livreor.php">Livre D'Or</dt>			
        <dt onmouseover="javascript:montre('smenu8');" ><a href="lien.php">Liens</dt>
		

</dl>

</body>
</html>

la feuille CSS associé:

corpsmenu {
margin: 0;
padding: 0;
background: white;
font: 70% verdana, arial, sans-serif;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu 
{
position:absolute;
top: 35%;
left: 1%;
}
#menu 
{
width: 8em;
}
#menu dt 
{
margin: 2px;
height: 25px;
line-height: 20px;
text-align: center;
font-weight: bold;
border: 1px solid white;
background: black;
}
#menu dd 
{
border: 1px solid gray;
}
#menu li 
{
text-align: center;
background: black;
}
#menu li a, #menu dt a 
{
font-weight: bold;
color: green;
text-decoration: none;
display: block;
border: 0 none;
height: 100%;
}
#menu li a:hover, #menu dt a:hover 
{
background: grey;
color: yellow;
}

la feuille CSS du reste du site:

body
{
width: 760px;
margin-bottom: 20px;
margin-top: 20px;
background-image:url("ecran.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
}

#en-tete
{
width: 770px;
height: 165px;
background-repeat: no-repeat;
margin-bottom: 10px;
margin-left: 150px;
}
.ban
{
color: white;
}
.ban:hover
{
color: white;
}


#corps
{
width: 800px;
margin-left: 140px;
margin-bottom: 20px;
padding: 5px;
color: white;
background-color: black;
background-repeat: repeat-x;
border: 4px outset rgb(0,0,0);
text-align: justify;
}
a
{
text-decoration: none;
color:green;
}
a:hover
{
   text-decoration: none;
   color: yellow; 
   font-weight: bold;
}
table
{
border-collapse: collapse;
margin: auto;
border: 4px outset rgb(112,7,112); /* Bordure du tableau avec effet 3D (outset) */
width: 600px; /*Taille générale du tableau */
color: white;
}
td
{
border: 1px solid white;
padding: 5px;
text-align: center;
}
.flottant
{
float: left
}
.souligne
{
text-decoration: underline;
}
.chanson, .groupe
{
color: red;
font-weight: bold;
}
.titre
{
color: blue;
font-weight:bold;
text-align: center;
font-family: Algerian, Arial, serif;
}

.First
{
color: white;
}
.paroles
{
text-align: center;
color: red;
}
#pied_de_page
{
padding: 5px;
position: absolute;
left: 145px;
margin-top: 30px;
color: white;
background-color: black;
background-repeat: repeat-x;
border: 4px outset rgb(0,0,0);
width: 800px;
height: 50px;
text-align: center;
}
.livreor
{
position: relative;
left: 25%;
}

J'espère que vous pourrez m'aider!
Merci d'avance!
Modifié par kilik2049 (24 Jul 2008 - 21:19)

Heyoan

24 Jul 2008 à 15:09

Hello kilik2049 et bienvenue Smiley cligne

,

kilik2049 a écrit :
Tout marche, seulement voilà: le texte de mes pages devient un lien vers une page du site!!

De quel texte parles-tu ? En l'état ton code ne semble pas permettre de reproduire le problème Smiley rolleyes

...

kilik2049

24 Jul 2008 à 15:22

Eh bien dès que je met l'include du menu sur une page, tout le code de cette page (dan un div corps) devient un lien vers une page (toujours la même, la dernière partie du menu)
je poste le code minimal appliqué à chaque page de mon site:

<!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>Blind Tears - The Official Website!</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	   <meta name="author" content="Dark Simoon"/>
	   <meta name="keywords" content="Blind Tears, Metal, metal, heavy, Dark Simoon, Frankette, Bat'Gland, Taillefine, 
	   Chtouf, groupe, band, Le Mans, Le mans, le mans, le Mans"/>
	   <meta name="Description" content="Le site du groupe de metal manceau Blind Tears"/>
	   <meta name="robots" content="index"/>
	   <link rel="stylesheet" media="screen" type="text/css" title="Design" href="new 5.css" />
	   <link rel="icon" type="image/png" href="favicon.ico" />
	</head>
   <body>
<?php 
include("banniere.php");
?>
<?php 
include("menu2.php");
?>

<div id="corps">


<!-- c'est dans ce div que le texte devient un lien-->

</div>


<div id="pied_de_page">
<p>Copyright "Blind Tears" 2008, tous droits réservés</p>
</div>
   </body>
</html>

Heyoan

24 Jul 2008 à 15:48

Ah OK ! En fait les erreurs étaient déjà dans ton premier post : les liens ne sont pas fermés. Par exemple

<a href="bio.php">Biographie[b][#blue]</a>[/#][/b]</dt>

kilik2049

24 Jul 2008 à 15:51

Merciiiiiiiiiiiiiiiiiiiiiii!
Je me doutais que c'était une erreur toute bête, mais je n'arrivais pas à trouver!!
Vraiment merci, je commençais à désespérer!!
Je mettrais l'adresse de mon site une fois fini Smiley langue

Heyoan

24 Jul 2008 à 15:56

De rien !

Tu considères que ce sujet est [Résolu] ? Smiley cligne

kilik2049

24 Jul 2008 à 16:05

Oui il l'est!!
Mon site marche parfaitement, reste plus qu'à l'héberger!

Heyoan

24 Jul 2008 à 16:37