<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Menu Horizontal Déroulant</title>
<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" media="screen">
<!--
body {
margin: 0;
padding: 0;
background: white;
font: 80% "Comic Sans MS", cursive;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#navigation dl {
float: left;
width: 12em;
}
#navigation dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #ffffff;
border: 1px solid gray;
margin: 1px;
}
#navigation dd {
display: none;
border: 1px solid black;
}
#navigation li {
text-align: center;
background: #fff;
}
#navigation li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 10%;
border: 0 none;
}
#navigation li a:hover, #navigation li a:focus, #navigation dt a:hover, #navigation dt a:focus {
background: #000000;
color:#FFF;
}
#site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray;
}
-->
</style>
</head>
<body>
<div id="navigation">
<dl>
<dt onmouseover="javascript:montre('smenu1');">Règlement</dt>
<dd id="smenu1">
<ul>
<li><a href="">Lalalilalilala</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenu2');">Contexte</dt>
<dd id="smenu2">
<ul>
<li><a href="">Lalalilalilala</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenu3');">Présentations</dt>
<dd id="smenu3">
<ul>
<li><a href="">Lalalilalilala</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenu4');">Copyright</dt>
<dd id="smenu4">
<ul>
<li><a href="">Menu © Haricoow pour CSSActif</a></li>
</ul>
</dd>
</dl>
</div>
</body>
</html>
Sam 30 Mar 2024, 22:07 par 
