le code de ma page est le suivant : <script type="text/javascript"> <!-- script du menu. 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 d'ouverture de pop up function ouvreFenetre(page, largeur, hauteur) { window.open(page, "", "scrollbars=no,location=no,menubar=no,toolbar=yes,resizable=no,directories=no,status=no,width=" + largeur + ",height=" + hauteur); } //-->
function change(largeur,hauteur) { window.resizeTo(hauteur,largeur); }
function twFermer() { window.close(); } </script> </head>
if (!isset($_GET['page'])) { $page1= 'accueil'; } else { $page1= $_GET['page']; } switch($page1) { case 'accueil': include ('accueil.php');break; case 'albummp3': include ("http://bpagnon.info/bdd/indexalbumsmp3.php?utilisateur=$user" );break; case 'DVD': include ("http://bpagnon.info/bdd/indexfilmsdvd.php?utilisateur=$user" );break; case 'bonsplans':include ('http://bpagnon.info/bonsplans/index.php');break; case 'CV':include ('http://bpagnon.info/cv/cv1.php');break; case 'liens':include ('http://bpagnon.info/liens/index.php');break; case 'ete2006':include ('http://bpagnon.info/photos/2006ete.php');break; case 'telechargementmozilla':include ('http://bpagnon.info/telechargements/mozilla.php');break; case 'telechargementmsn':include ('http://bpagnon.info/telechargements/msn.php');break; case 'wol':include ('http://bpagnon.info/informatique/wol.php');break; } ?> </DIV> </div>
Sous firefox, il ni a pas de soucis pour l'affichage, mais sous IE, les éléments du menu sont transparants. Pour vous faire une idée : http://www.bpagnon.info/index.php . En fait, je voudrais que lorsque le visiteur aille dans 'base de données', le texte de la partie de droite soit recouverte. quel est le bon code? Merci de votre aide
Marsh Posté le 10-10-2006 à 15:59:20
bonjour
pour mon site, j'usilise le code css suivant :
.page {
height: 100%;
width: 100%;
}
.cadregauche {
width: 20%;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
background-color: #33FFFF;
position: absolute;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
}
#menu dt {
cursor: pointer;
background: #A9BFCB;
height: 20px;
line-height: 20px;
margin: 2px 0;
border: 1px solid gray;
text-align: center;
font-weight: bold;
}
#menu dd {
position: absolute;
z-index: 100;
left: 8em;
margin-top: -1.4em;
width: 10em;
background: #A9BFCB;
border: 1px solid gray;
}
#menu ul {
padding: 2px;
}
#menu li {
text-align: center;
font-size: 85%;
height: 18px;
line-height: 18px;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
}
#menu li a:hover {
text-decoration: underline;
}
#mentions {
font-family: verdana, arial, sans-serif;
position: absolute;
bottom : 200px;
left : 10px;
color: #000;
background-color: #ddd;
}
#mentions a {text-decoration: none;
color: #222;
}
#mentions a:hover{text-decoration: underline;
}
.cadredroit {
width: 80%;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 20%;
font-size: 14px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
color: #000000;
text-decoration: none;
position: absolute;
height: 100%;
}
le code de ma page est le suivant :
<script type="text/javascript">
<!-- script du menu.
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 d'ouverture de pop up
function ouvreFenetre(page, largeur, hauteur)
{
window.open(page, "", "scrollbars=no,location=no,menubar=no,toolbar=yes,resizable=no,directories=no,status=no,width=" + largeur + ",height=" + hauteur);
}
//-->
function change(largeur,hauteur)
{
window.resizeTo(hauteur,largeur);
}
function twFermer()
{
window.close();
}
</script>
</head>
<body>
<div class="page">
<div class="cadregauche">
<dl id="menu">
<dt onMouseOver="javascript:montre('smenu1');" onMouseOut="javascript:montre();"><a href="index.php?page=accueil">Accueil</a> </dt>
<dt onMouseOver="javascript:montre('smenu2');" onMouseOut="javascript:montre();"><a href="#">Bases de données</a> </dt>
<dd id="smenu2" onMouseOver="javascript:montre('smenu2');" onMouseOut="javascript:montre();">
<ul>
<li><a href="index.php?page=albummp3">MP3</a></li>
<li><a href="index.php?page=DVD">DVD</a></li>
</ul>
</dd>
<dt onMouseOver="javascript:montre('smenu3');" onMouseOut="javascript:montre();"><a href="index.php?page=bonsplans">Bons
plans</a></dt>
<dt onMouseOver="javascript:montre('smenu4');" onMouseOut="javascript:montre();"><a href="index.php?page=CV">C.V.</a></dt>
<dt onMouseOver="javascript:montre('smenu5');" onMouseOut="javascript:montre();"><a href="#">Informatique</a></dt>
<dd id="smenu5" onMouseOver="javascript:montre('smenu5');" onMouseOut="javascript:montre();">
<ul>
<li><a href='index.php?page=wol'>le Wake On Lan</a></li>
</ul>
</dd>
<dt onMouseOver="javascript:montre('smenu6');" onMouseOut="javascript:montre();"><a href="index.php?page=liens">Liens</a></dt>
<dt onMouseOver="javascript:montre('smenu7');" onMouseOut="javascript:montre();"><a href="#">Photos</a></dt>
<dd id="smenu7" onMouseOver="javascript:montre('smenu7');" onMouseOut="javascript:montre();">
<ul>
<li><a href="index.php?page=ete2006">Eté 2006</a></li>
</ul>
</dd>
<dt onMouseOver="javascript:montre('smenu8');" onMouseOut="javascript:montre();"><a href="#">Téléchargements</a></dt>
<dd id="smenu8" onMouseOver="javascript:montre('smenu8');" onMouseOut="javascript:montre();">
<ul>
<li><a href="index.php?page=telechargementmozilla">Mozilla</a></li>
<li><a href="index.php?page=telechargementmsn">MSN</a></li>
</ul>
</dd>
</dl>
</div>
<DIV class="cadredroit">
<?php
if (!isset($_GET['page']))
{
$page1= 'accueil';
} else {
$page1= $_GET['page'];
}
switch($page1)
{
case 'accueil': include ('accueil.php');break;
case 'albummp3': include ("http://bpagnon.info/bdd/indexalbumsmp3.php?utilisateur=$user" );break;
case 'DVD': include ("http://bpagnon.info/bdd/indexfilmsdvd.php?utilisateur=$user" );break;
case 'bonsplans':include ('http://bpagnon.info/bonsplans/index.php');break;
case 'CV':include ('http://bpagnon.info/cv/cv1.php');break;
case 'liens':include ('http://bpagnon.info/liens/index.php');break;
case 'ete2006':include ('http://bpagnon.info/photos/2006ete.php');break;
case 'telechargementmozilla':include ('http://bpagnon.info/telechargements/mozilla.php');break;
case 'telechargementmsn':include ('http://bpagnon.info/telechargements/msn.php');break;
case 'wol':include ('http://bpagnon.info/informatique/wol.php');break;
}
?>
</DIV>
</div>
Sous firefox, il ni a pas de soucis pour l'affichage, mais sous IE, les éléments du menu sont transparants. Pour vous faire une idée : http://www.bpagnon.info/index.php . En fait, je voudrais que lorsque le visiteur aille dans 'base de données', le texte de la partie de droite soit recouverte. quel est le bon code?
Merci de votre aide