table固定表头和第一列

$("#tableDiv").scroll(function(){//给table外面的div滚动事件绑定一个函数
var left=$("#tableDiv").scrollLeft();//获取滚动的距离
var top=$("#tableDiv").scrollTop();//获取滚动的距离
var trs=$("#tableDiv table tr");//获取表格的所有tr
trs.each(function(i){//对每一个tr(每一行)进行处理
//获得每一行下面的所有的td,然后选中下标为0的,即第一列,设置position为相对定位
//相对于父div左边的距离为滑动的距离,然后设置个背景颜色,覆盖住后面几列数据滑动到第一列下面的情况
//如果有必要也可以设置一个z-index属性
if(i==0){
$(this).children().css({"position":"relative","top":top,"background-color":"#F0F0F0"});
}
$(this).children().eq(0).css({"position":"relative","left":left,"background-color":"#F0F0F0"});
});
});

posted @ 2017-09-15 14:43  Jacks~Frank  阅读(4616)  评论(0编辑  收藏  举报