Bonjour,
Je suis débutante en java script. pour mon site personnel j'ai crée un menu déroulant avec le java script. Il marche enfin mais le problème c'est qu'il se déplace en fonction de la taille de la fenêtre ouverte. J'ai essayé de résoudre le problème mais je n'ai pas réussi.
Merci d'avance pour votre aide.
Voila le nom de mon site: www.alina-creations.com
Mon code source:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Document sans nom</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type='text/javascript'>
function afficher(nom){
//alert(nom);
document.getElementById(nom).style.display="block";
}
function supprimer(nom){
//alert(nom);
document.getElementById(nom).style.display="none";
}
</script>
<style type="text/css">
#menu{
position :absolute;
z-index:10;
left:560px;
top:126px;
}
.onglet{
postion:relative;
float:left;
}
#accueil{
display:none;
background:#FFFFFF;
width:65px;
}
#publicité{
display:none;
background:#FFFFFF;
width:90px;
}
#art{
display:none;
background:#FFFFFF;
width:61px;
}
#cv{
display:none;
background:#FFFFFF;
width:31px;
}
#contact{
display:none;
background:#FFFFFF;
width:66px;
}
#menuv{
position :absolute;
z-index:10;
left:410px;
top:300px;
width:106px;
}
.ongletv{
postion:relative;
float:left;
}
#publicitév{
display:none;
background:#FFFFFF;
width:106px;
}
#artv{
display:none;
background:#FFFFFF;
width:61px;
}
#cvv{
display:none;
background:#FFFFFF;
width:31px;
}
#contactv{
display:none;
background:#FFFFFF;
width:66px;
</style></head>
<body>
<div id ="menu">
<div class="onglet">
<a href="index.html" target="_self"><img src="site/menu/menu_01.gif" border="0"></a></div>
<div class="onglet"
onmouseover="afficher('publicité')";
onmouseout= "supprimer('publicité')";>
<img src="site/menu/menu_02.gif " border="0">
<div id="publicité">
<a href="pubspage.php?page=0" target="_self"><img src="site/menu/menu_07.gif" border="0"><br/></a>
<a href="airaffiches.php?page=7" target="_self"><img src="site/menu/menu_10.gif" border="0"><br/></a>
<img src="site/menu/menu_12.gif" border="0"><br/>
<img src="site/menu/menu_14.gif" border="0"><br/>
</div></div>
<div class="onglet"
onmouseover="afficher('art')";
onmouseout= "supprimer('art')";>
<img src="site/menu/menu_03.gif" border="0">
<div id= "art">
<a href="peinturepage2.php?page=0"><img src="site/menu/menu_08.gif" border="0"><br/></a>
<a href="dessinpage.php?page=14"><img src="site/menu/menu_11.gif" border="0"><br/></a>
<a href="tapisseriepage.php?page=0"><img src="site/menu/menu_13.gif" border="0"><br/></a>
</div></div>
<div class="onglet">
<a href="cvpage.html"><img src="site/menu/menu_04.gif" border="0"></div>
<div class="onglet">
<a href="contactpage.html"><img src="site/menu/menu_05.gif" border="0"></a></div>
</div>
<div id ="menuv">
<div class="ongletv" onmouseover="afficher('publicitév')"; >
<img src="site/menu/menu2_01.jpg" />
<div id="publicitév" onmouseout= "supprimer('publicitév')";>
<a href="pubspage.php?page=0" target="_self"><img src="site/menu/menu_07.gif" border="0"></a><br/>
<a href="airaffiches.php?page=7" target="_self"><img src="site/menu/menu_10.gif" border="0"><br/></a>
<img src="site/menu/menu_12.gif" border="0"><br/>
<img src="site/menu/menu_14.gif" border="0"><br/>
</div>
</div>
<div class="ongletv"
onmouseover="afficher('artv')";><img src="site/menu/menu2_02.jpg" />
<div id= "artv" onmouseout= "supprimer('artv')";>
<a href="peinturepage2.php?page=0"><img src="site/menu/menu_08.gif" border="0"><br/></a>
<a href="dessinpage.php?page=14"><img src="site/menu/menu_11.gif" border="0"><br/></a>
<a href="tapisseriepage.php?page=0"><img src="site/menu/menu_13.gif" border="0"><br/></a>
</div></div>
<div class="ongletv">
<a href="cvpage.html"><img src="site/menu/menu2_03.jpg" border="0"/></div>
<div class="ongletv">
<a href="contactpage.html"><img src="site/menu/menu2_04.jpg" border= "0"/></a></div>
</div>
<table width="751" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="751"><img src="site/images/alinapaun.jpg" width="750" height="111"></td>
</tr>
<tr>
<td><table width="750" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="435"><img src="site/images/book.jpg" width="435" height="59"></td>
<td width="54" valign="top"><a href="index.html" target="_self"></a></td>
<td width="51" valign="top"><a href="airaffiches.php?page=7" target="_self"></a></td>
<td width="49" valign="top"><a href="pagefeu.html" target="_self"></a></td>
<td width="51" valign="top"><a href="peinturepage2.php?page=0" target="_self"></a></td>
<td width="61" valign="top"><a href="tapisseriepage.php?page=0" target="_self"></a></td>
<td width="192" valign="top"><a href="contactpage.html" target="_self"></a></td>
</tr>
</table></td>
</tr>
<tr>
<td><table width="750" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="318" height="366" align="center"><p><img src="site/images/imagesaccueil.jpg" width="187" height="366"></p> </td>
<td width="141"><table width="122" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="122" align="left" valign="middle"><a href="airaffiches.php?page=7" target="_self"></a></td>
</tr>
<tr>
<td align="left"><a href="pagefeu.html" target="_self"></a></td>
</tr>
<tr>
<td align="left"><a href="peinturepage2.php?page=0" target="_self"></a></td>
</tr>
<tr>
<td height="27" align="left"> <a href="tapisseriepage.php?page=0" target="_self"></a></td>
</tr>
</table>
<p> </p>
<p> </p></td>
<td width="291"><p> </p>
<p> </p>
<p><img src="site/images/bienvenue.jpg" width="291" height="113"></p></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>