1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63
| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Exemple de design fluide avec menu fixe par javascript</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<STYLE type=text/css>
html { overflow:hidden; }
body { overflow:hidden; font-family: trebuchet ms,arial,tahoma,verdana,sans-serif;}
code {font-size:1em;}
#bloc-fixe {
position:fixed;
border:solid 1px;
background-color:#F7F3EA;
width:118px;
top:10px;
left:10px;
bottom:10px;
overflow:auto;
font-size:90%;
}
#bloc-variable {
position:fixed;
border:solid 1px;
background-color:#86ECB9;
top:10px;
left:138px;
bottom:10px;
right:0px;
padding:10px;
overflow:auto;
}
</STYLE>
<!--[if lt IE 7]>
<STYLE type=text/css>
#bloc-fixe, #bloc-variable {
position:absolute;
height: expression(( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) - (10+10+11) + "px");
}
#bloc-variable {
width: expression(( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) - (158+1) + "px");
}
</STYLE>
<noscript>
<STYLE type=text/css>
#bloc-fixe, #bloc-variable {height:100%;top:0px}
#bloc-variable { width:650px}
html { overflow:auto; }
body { overflow:auto; }
</STYLE>
</noscript>
<![endif]-->
</head>
<body>
<div id="bloc-fixe">
</div>
<div id="bloc-variable">
</div>
<script type="text/javascript">
document.getElementById("bloc-variable").focus()
</script>
</body>
</html> |
Partager