对于静态的表格,固定表头比较简单的实现方法,各浏览器下都可以显示,IE下,表头的栏线不是对得很齐.
浏览器: FireFox 13.1 , Chrome 18.1 , IE6,7,8.
特别注意的是,在IE下,第一行的代码一定要有,要不无法实现.
html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “/TR/xhtml1/DTD/xhtml1-strict.dtd”>
.fixed {
background: #ccc;
border-collapse:collapse;
border: 1px solid #0066ff;
/*position:absolute;*/
}
.scroll_layer {
width: 500px;
height: 200px;
overflow:auto;
}
table { width:95%;}
$(document).ready(function(){
function set_fixed_head(n)
{
$(“.fixed”).css(“position”,”static”);
var id = “#a” + n.toString();
var id_pre = “”;
var p ;
var s ;
if (n == 0)
{
p = $(id);
s = p.position();
$(id).css(“left”,s.left);
$(id).css(“width”,p.width() );
if ($.browser.msie)
{
$(id).css(“_width”,p.width() -0); // for ie6
$(id).css(“*width”,p.width() -0); // for ie7
var w8 = p.width() -3;
var v8 = w8.toString() + “px”; // for ie8
$(id).attr(“style”,”width:” + v8 );
//alert( parseInt($.browser.version, 10) );
}
}
else
{
id_pre = “#a” + (n-1).toString();
p = $(id_pre);
s = p.position();
//$(id).css(“left”,s.left + $(id).width() );
$(id).css(“left”,$(id).position().left );
$(id).css(“width”, $(id).width() );
if ($.browser.msie)
{
//$(id).css(“left”,s.left + $(id).width() );
$(id).css(“_width”,$(id).width() -0); // for ie6
$(id).css(“*width”,$(id).width() -0); // for ie7
var w8 = $(id).width() -0;
var v8 = w8.toString() + “px”; // for ie8 px\9 的ie hacker 无法运行,jquery.
$(id).css(“width”, $(id).width() );
}
}
}
set_head();
function set_head()
{
for (n = 0; n < 3; n++)
{
set_fixed_head(n);
}
$(“.fixed”).css(“position”,”absolute”);
//$(“.fixed”).css(“position”,”fixed”);
}
//$(window).resize( function() { set_head(); location.reload();});
});
