bonjour a tous,
voic donc mon probleme: adapter mon menu deroulant pour ie6 !
...car je ne sais pas trop comment faire tout seul ...
j'ai bien un autre style de menu deroulant avec un javascript, mais je ne sais pas le modifier, et je ne sais meme pas si c'est adaptable a mon menu
pouvez vous m'aider, sioux plait ?
voici mon code simplifié, avec le javascript de l'autre menu, si ça peut aider ...
merci d'avance a vous tous !!
voic donc mon probleme: adapter mon menu deroulant pour ie6 !
...car je ne sais pas trop comment faire tout seul ...
j'ai bien un autre style de menu deroulant avec un javascript, mais je ne sais pas le modifier, et je ne sais meme pas si c'est adaptable a mon menu
pouvez vous m'aider, sioux plait ?
voici mon code simplifié, avec le javascript de l'autre menu, si ça peut aider ...
merci d'avance a vous tous !!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="Description" content="" >
<meta name="keywords" content="" >
<meta name="language" content="fr" >
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/JavaScript">
<!--
window.onload=montre2;
function montre2(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>
<!--
ici le type de ligne a inserer pour ce style de menu avec js :
<dd style="display: none;" id="smenu1" onmouseover="javascript:montre2('smenu1');" onmouseout="javascript:montre2();">-->
<style type="text/css">
<!--
body {
padding: 0;
margin: 0;
text-align: center;/**/
background-image:url(../images/images_site/fond-2010.jpg);/**/
background-repeat:no-repeat;
background-position: center top;
background-color:#19564E;/**/
font-family:
"Palatino Linotype",
Palatino,
Palladio,
"URW Palladio L",
"Book Antiqua",
Baskerville,
"Bookman Old Style",
"Bitstream Charter",
"Nimbus Roman No9 L",
Garamond,
"Apple Garamond",
"ITC Garamond Narrow",
"New Century Schoolbook",
"Century Schoolbook",
"Century Schoolbook L",
Georgia,
serif;
}
#header{
border: 1px solid red;/**/
position:relative;
margin-left: auto;
margin-right: auto;
width:950px;
height:143px;
z-index:2;
/*background-image:url(../images/images_site/bandeau2-2010.png); */
text-align: left;
}
#global{
border: 1px solid red;/**/
position:relative;
margin-left: auto;
margin-right: auto;
width: 950px;
text-align: left;
min-height:600px;
z-index:1;
}
#menu_gauche{
border: 1px solid red;/**/
float:left;
position:relative;
width: 120px;
height:395px;
text-align: left;
}
#page_principale a{color:#E3DCC2; }
#page_principale{
border: 1px solid red;/**/
/*float:left;*/
color:#E3DCC2;
padding-top:30px;
margin-left:140px;
position:relative;
left:0px;
width:790px;
height:630px;
z-index:3;
overflow:auto;/**/
/*text-align: left;*/
}
#onglets{
/*float:right;*/
position:relative;
width: 650px;
/*height:155px;*/
/*top:-50px;*/
margin-left:250px;
text-align: center;
font-weight:bold;
z-index:4;
}
#footer{
border: 1px solid red;/**/
position:relative;
width: 950px;
height:80px;
clear:both;
text-align: left;
}
#menuDeroulant
{
background: #5B1900;
width: 600px;
height: 30px;
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
position: absolute;
top: 0;
left: 0;
}
#menuDeroulant li
{
float: left;
width: 150px;
margin: 0;
padding: 0;
border: 0;
}
#menuDeroulant li a:link, #menuDeroulant li a:visited
{
display: block;
height: 1%;
color: #E3DCC2;
margin: 0;
padding: 3px 8px;
border-right: 1px solid #E3DCC2;
border-left: 1px solid #E3DCC2;
text-decoration: none;
}
#menuDeroulant li a:hover { background-color: #000; }
#menuDeroulant li a:active { background-color: #000; }
#menuDeroulant .sousMenu
{
display: none;
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
text-align:left;
}
#menuDeroulant .sousMenu li
{
float: none;
margin: 0;
padding: 0;
border: 0;
width: 150px;
background-color: #5B1900;
border-top: 1px solid transparent;
border-right: 1px solid transparent;
}
#menuDeroulant .sousMenu li a:link, #menuDeroulant .sousMenu li a:visited
{
display: block;
color: #E3DCC2;
margin: 0;
border: 0;
text-decoration: none;
}
#menuDeroulant .sousMenu li a:hover
{
background-image: none;
background-color: #000;
}
#menuDeroulant li:hover > .sousMenu { display: block; }
-->
</style>
<title> Bienvenue </title>
</head>
<body>
<noscript><h2 align="center">Activez Javascript, il est necessaire pour ce site !<h2></noscript>
<!--[if lt IE 7]> <h2>l'affichage sera bien mieux avec une version plus recente de internet explorer ou bien avec firefox</h2><![endif]-->
<div id="header">
<div id="onglets">
<ul id="menuDeroulant"> <!-- -->
<li><a href="index.php">Accueil</a></li>
<li><a href="catalogue_realisations.php">Réalisations</a>
<ul class="sousMenu">
<li><a href="produits.php?cat=1"> Constructions</a></li>
<li><a href="produits.php?cat=2"> Sites Web</a></li>
<li><a href="produits.php?cat=3"> Atelier</a></li>
<li><a href="produits.php?cat=4"> Autres</a></li>
<li><a href="produits.php?cat=4"> essai</a></li>
</ul>
</li>
<li><a href="liens.php">Liens</a></li>
<li><a href="contact.php">Contact</a></li>
</ul>
</div>
</div>
<div id="global">
<div id="menu_gauche">
Dimanche 30 mai 2010
<br><br><b>Dernière réalisation :</b><br>
<a href="detail_produit.php?num=9&numoption=52" border="0" title="renovation-chambre-09-01.jpg"><img src="images/images_produits/vignettes/renovation-chambre-09-01.jpg"
title="voir la derniere réalisation" width="80" border="1"></a>
</div>
<!--<div id="menu_droite">
<br>
MENU DROITE
</div>-->
<div id="page_principale">
<br><br>
<h3 align="center">Bienvenue<br/>
Vous pouvez accéder à mes réalisations<br>
en cliquant sur l'image en dessous<br/></h3><br/><br/>
<div align="center">
<br><a href="catalogue_realisations.php" title="Le catalogue des réalisations">
<img src="images/images_produits/08-10-10-portail_avant-reparation.jpg" width="350" /></a>
<br/>Une réalisation au hasard !
</div>
</div><!--principal-->
<div id="footer">
<!----><p style="padding-top:20px;" align="center">
<span style="padding-left:100px;"></span></p>
</div>
</div><!--global-->
</body>
</html>
