Copy Code code as follows:
<%@ page language= "java" contenttype= "text/html; Charset=utf-8 "
pageencoding= "UTF-8"%>
<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "HTTP://WWW.W3.ORG/TR/HTML4/LOOSE.DTD" >
<title></title>
<script>
/**
* @param otarget need to load scroll DOM objects
* @param callback function for Fnhandler processing
*/
function EventHandler (Otarget, Fnhandler) {
if (Otarget.addeventlistener) {
Otarget.addeventlistener ("Scroll", Fnhandler, false);
else if (otarget.attachevent) {
Otarget.attachevent ("Onscroll", Fnhandler);
} else {
otarget["onscroll"] = Fnhandler;
}
};
Function oo (Divcontentid, Divheaderid) {
var div = document.getElementById (divcontentid);
var left = Div.scrollleft;
var divheader = document.getElementById (Divheaderid);
Divheader.scrollleft = left;
var diswidth = div.children[0].style.width.replace ("px", "")
-Div.style.width.replace ("px", "");
if (div.scrollleft >= diswidth) {
DivHeader.style.overflowY = ' scroll ';
} else {
DivHeader.style.overflowY = ' hidden ';
}
}
Window.onload = function Onstartlock () {
var odiv = document.getElementById ("Divcontentid");
EventHandler (Odiv, function () {
OO ("Divcontentid", "Divheaderid");
});
};
</script>
<body>
<div id= "Div1all"
Style= "Position:absolute; left:0px; right:0px; top:0px; bottom:0px ">
<div id= "Divheaderid"
Style= "Margin-right:auto; Margin-left:auto; Overflow:hidden; " >
<table border= "1" cellspacing= "0"
Style= "BORDER-COLLAPSE:COLLAPSE; font-size:15px "
Bordercolor= "#c1dad7" cellpadding= "0" bgcolor= "#f5fffa"
Width= "600px" >
<tr style= "Background:navy; Color:white; height:30px ">
<th width= "100px" >header a</th>
<th width= "100px" >header b</th>
<th width= "100px" >header c</th>
<th width= "100px" >header d</th>
<th width= "100px" >header e</th>
<th width= "100px" >header f</th>
</Tr>
</table>
</div>
<div id= "Divcontentid"
Style= "Position:absolute; left:0px; top:30.5px; bottom:0px; right:0px; Overflow:scroll ">
<table border= "1" cellspacing= "0"
Style= "BORDER-COLLAPSE:COLLAPSE; font-size:15px "
Bordercolor= "#c1dad7" cellpadding= "0" bgcolor= "#f5fffa"
Width= "600px" >
<Tr>
<TD width= "100px" >A</Td>
<TD width= "100px" >B</Td>
<TD width= "100px" >C</Td>
<TD width= "100px" >D</Td>
<TD width= "100px" >E</Td>
<TD width= "100px" >F</Td>
</Tr>
<Tr>
<TD width= "100px" >A</Td>
<TD width= "100px" >B</Td>
<TD width= "100px" >C</Td>
<TD width= "100px" >D</Td>
<TD width= "100px" >E</Td>
<TD width= "100px" >F</Td>
</Tr>
<Tr>
<TD width= "100px" >A</Td>
<TD width= "100px" >B</Td>
<TD width= "100px" >C</Td>
<TD width= "100px" >D</Td>
<TD width= "100px" >E</Td>
<TD width= "100px" >F</Td>
</Tr>
<Tr>
<TD width= "100px" >A</Td>
<TD width= "100px" >B</Td>
<TD width= "100px" >C</Td>
<TD width= "100px" >D</Td>
<TD width= "100px" >E</Td>
<TD width= "100px" >F</Td>
</Tr>
<Tr>
<TD width= "100px" >A</Td>
<TD width= "100px" >B</Td>
<TD width= "100px" >C</Td>
<TD width= "100px" >D</Td>
<TD width= "100px" >E</Td>
<TD width= "100px" >F</Td>
</Tr>
</table>
</div>
</div>
</body>