Menu css

Fermé
tophe03 Messages postés 327 Date d'inscription lundi 24 janvier 2005 Statut Membre Dernière intervention 14 avril 2010 - 16 avril 2006 à 23:40
tophe03 Messages postés 327 Date d'inscription lundi 24 janvier 2005 Statut Membre Dernière intervention 14 avril 2010 - 17 avril 2006 à 16:42
Bonjour

Je fais actuellement un menu avec une feuille css.
voici le code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<HTML><HEAD><TITLE>Archipel des Sciences</TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1" />
<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>

<style type="text/css">
<!--
body {
margin: 0;
padding: 0;
background: white;
font: 75% Arial, Helvetica, sans-serif;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
top: 0;
left: 0;
}
#menu {
width: 187px;
margin: 0px;
border: 0px;
}
#menu dt {
color: black;
cursor: pointer;
margin: 0px;
height: 20px;
text-align: right;
font-weight: bold;
border: 0px;
background-image : url("framegauche_fichiers/bn.gif");
text-decoration: none;
}
#menu dd {
color: black;
width: 187px;
height: 20px;
background: white;
border: 0px;
text-decoration: none;
}
#menu li {
text-align: right;
color: black;
background-image: url("framegauche_fichiers/bn.gif");
text-decoration: none;
}
#menu li a, #menu dt a {
display: block;
color: black;
border: 0 none;
height: 100%;
background-image: url("framegauche_fichiers/bn.gif");
text-decoration: none;
}

#menu li a:hover, #menu dt a:hover {
background-image : url("../images/bn-over.gif");
text-decoration: none;
}

#menu1 {
width: 187px;
margin: 0px;
border: 0px;
}

#menu1 dt {
margin: 0px;
border: 0px;
background-image : url("framegauche_fichiers/sousmenu.gif");
}

-->
</style>

<META content="MSHTML 6.00.2800.1543" name=GENERATOR /></HEAD>
<BODY bgColor=#ffffff leftMargin=0 topMargin=0
MARGINWIDTH="0" MARGINHEIGHT="0">
<dl id="menu">

<dt onmouseover="javascript:montre();" onmouseout="javascript:montre();"><a href="http://www.archipel-des-sciences.org/html/accueil.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Accueil</DIV>
</a></dt>

<dt onmouseover="javascript:montre();" onmouseout="javascript:montre();"><a href="http://www.archipel-des-sciences.org/html/presentation.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Présentation</DIV>
</a></dt>

<dt onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre();"><a href="http://www.archipel-des-sciences.org/html/activitesetprojets.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Activités et Projets</DIV>
</a></dt>

<dd id="smenu3" onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre();">
<ul>
<li><a href="#">
<DIV style="position:relative; right: 25px;">Jardin créole</DIV>
</a></li>
<li><a href="#">
<DIV style="position:relative; right: 25px;">Astronomie</DIV>
</a></li>
<li><a href="#">
<DIV style="position:relative; right: 25px;">Secteur mer</DIV>
</a></li>
<li><a href="#">
<DIV style="position:relative; right: 25px;">Environnement</DIV>
</a></li>
<li><a href="#">
<DIV style="position:relative; right: 25px;">Activités solaires</DIV>
</a></li>
<li><a href="#">
<DIV style="position:relative; right: 25px;">Projets</DIV>
</a></li>
</ul>
</dd>

<dt onmouseover="javascript:montre('smenu4');" onmouseout="javascript:montre();">
<DIV style="position:relative; right: 25px;">Bulletins de l'ADS</DIV>
</dt>

<dd id="smenu4" onmouseover="javascript:montre('smenu4');" onmouseout="javascript:montre();">
<ul>
<li><a href="#">
<DIV style="position:relative; right: 25px;">Kaz A Syans</DIV>
</a></li>
<li><a href="#">
<DIV style="position:relative; right: 25px;">La Science au Quotidien</DIV>
</a></li>
</ul>
</dd>

<dt onmouseover="javascript:montre('smenu5');" onmouseout="javascript:montre();"><a href="http://www.archipel-des-sciences.org/html/cantredesressources.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Centre des ressources</DIV>
</a></dt>

<dd id="smenu5" onmouseover="javascript:montre('smenu5');" onmouseout="javascript:montre();">
<ul>
<li><a href="http://www.archipel-des-sciences.org/html/listedesperiodiques.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Périodiques</DIV>
</a></li>
<li><a href="http://www.archipel-des-sciences.org/html/documentsaudiovisuels.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Documents audiovisuels</DIV>
</a></li>
<li><a href="http://www.archipel-des-sciences.org/html/listedesexpositionsitinerantes.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Expositions itinérantes</DIV>
</a></li>
</ul>
</dd>

<dt onmouseover="javascript:montre();" onmouseout="javascript:montre();"><a href="http://www.archipel-des-sciences.org/html/liens.htm" target=mainFrame>
<DIV style="position:relative; right: 25px;">Liens</DIV>
</a></dt>

<dt onmouseover="javascript:montre('smenu7');" onmouseout="javascript:montre();">
<DIV style="position:relative; right: 25px;">Fête de la Science</DIV>
</dt>

<dd id="smenu7" onmouseover="javascript:montre('smenu7');" onmouseout="javascript:montre();">
<ul>
<li><a href="http://www.archipel-des-sciences.org/html/fetescience2005.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Fête de la Science 2005</DIV>
</a></li>
<li><a href="http://www.archipel-des-sciences.org/html/documentsaudiovisuels.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Fête de la Science 2004</DIV>
</a></li>
</ul>
</dd>

<dt onmouseover="javascript:montre();" onmouseout="javascript:montre();"><a href="http://asp.arapaho.gp/forum-archipeldessciences/forum/" target=mainFrame>
<DIV style="position:relative; right: 25px;">Forum</DIV>
</a></dt>

<dt onmouseover="javascript:montre();" onmouseout="javascript:montre();"><a href="http://www.archipel-des-sciences.org/html/recherche.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Recherche</DIV>
</a></dt>

<dt onmouseover="javascript:montre();" onmouseout="javascript:montre();"><a href="http://www.archipel-des-sciences.org/html/plandusite.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Plan du site</DIV>
</a></dt>

<dt onmouseover="javascript:montre();" onmouseout="javascript:montre();"><a href="http://www.archipel-des-sciences.org/html/pournousjoindre.HTM" target=mainFrame>
<DIV style="position:relative; right: 25px;">Contact</DIV>
</a></dt>

</dl>

<dl id="menu1">

<dt onmouseover="javascript:montre();" onmouseout="javascript:montre();"> </dt>

</dl>
</BODY></HTML>

Mon souci se trouve au niveau de "menu1". En fait, je veux qu'apparaisse en bas du menu une image différente. Mais comme je l'ai fait, avec "menu1", ça ne marche pas. Quelqu'un a-t-il une solution à me proposer?

Merci d'avance
A voir également:

1 réponse

tophe03 Messages postés 327 Date d'inscription lundi 24 janvier 2005 Statut Membre Dernière intervention 14 avril 2010 5
17 avril 2006 à 16:42
Il n'y a personne pour m'aider?
0