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 64 65 66 67 68 69 70 71 72 73 74
| <html style='font-size:14px;'>
<head>
<title>Page d'accueil</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width">
<meta name="viewport" content="initial-scale=1.0">
<link rel="stylesheet" href="Test0.css" type="text/css">
</head>
<body>
<script type="text/javascript">
function doOnScroll(mondiv)
{
document.getElementById("first_col").scrollTop=mondiv.scrollTop;
document.getElementById("entete").scrollLeft=mondiv.scrollLeft;
ce1.innerHTML=document.getElementById("first_col").scrollTop;
ce2.innerHTML=document.getElementById("entete").scrollLeft;
// alert(ce1.innerHTML);
}
</script>
<div id="general">
<div id="titre">
<table>
<tr>
<td>Titre</td>
</tr>
</table>
</div>
<div id="entete">
<table>
<tr>
<?php
$n=20;
$grec=array("Alpha","Beta","Gamma", "Delta","Epsilon","Zeta","Eta","Theta","Iota","Kappa","Lambda",
"Mu","Nu","Ksi","Omicron","Pi","Rho","Sigma","Tau","Upsilon","Phi","Khi","Psi","Omega");
foreach($grec as $l) echo("<td>$l</td>");
?>
</tr>
</table>
</div>
<div id="first_col">
<table>
<?php
for($i=1;$i<$n;$i++)echo("<tr><td>Ligne $i</td></tr>");
?>
</table>
</div>
<div id="the_table" onscroll="doOnScroll(this);">
<table>
<?php
for ($i=1;$i<$n;$i++)
{
echo("<tr>");
foreach($grec as $l)echo("<td>$l-$i</td>");
echo("</tr>");
}
?>
</table>
</div>
</div>
<script>
var iniv=document.getElementById("first_col").scrollTop;
var inih=document.getElementById("entete").scrollLeft;
var tab=document.getElementById("the_table");
var col=tab.getElementsByTagName("tr")[7];
var ce1=col.getElementsByTagName("td")[7];
var ce2=col.getElementsByTagName("td")[8];
ce1.style.color="#ffffff";
ce2.style.color="#ffffff";
//alert(ce1.innerHTML);
</script>
</body>
</html> |
Partager