冻结html表格标题列,HTML表格冻结第一列 | 学步园

基于jquery. 不说话, 看代码.

Welcome to schedule main page

html, body{

margin: 0;

padding: 0;

height: 100%;

background-color: #fff;

font-size: 10pt;

font-family: Arial, verdana;

}

#pagewraper{

width: 1000px;

margin: 0 auto;

}

.tb_job_list{

width: 1400px;

border-collapse: collapse;

}

.tb_job_list td{

border: solid #dadada 1px;

height: 30px;

font-size: 10pt;

color: #555555;

background-color: #fff;c

}

.tb_job_list thead td{

height: 40px;

font-weight: bold;

color: #999;

background-color: #fffceb;

}

a img{

border: none;

}

Job NameJob GroupNameJob DescriptionJob StatusLast Run StatusCommandRun MachineLast Run TimeNext Run TimeAction

Job 1descJOb 2JOb 2JOb 2JOb 2JOb 2JOb 2JOb 2JOb 2JOb 2JOb 2JOb 2JOb 2JOb 2JOb 2JOb 3desc

$(document).ready(function(){

var dataTb = $('#jobsList').first();

var newTb = $('

$('body').append(newTb);

newTb.css({

'position':'absolute',

'left':dataTb.attr('offsetLeft'),

'top:': dataTb.attr('offsetTop'),

'border-left-color':dataTb.css('border-left-color'),

'border-right-color':dataTb.css('border-right-color'),

'border-top-color':dataTb.css('border-top-color'),

'border-bottom-color':dataTb.css('border-bottom-color'),

'border-left-style':dataTb.css('border-left-style'),

'border-right-style':dataTb.css('border-right-style'),

'border-top-style':dataTb.css('border-top-style'),

'border-bottom-style':dataTb.css('border-bottom-style'),

'border-left-width':dataTb.css('border-left-width'),

'border-right-width':dataTb.css('border-right-width'),

'border-top-width':dataTb.css('border-top-width'),

'border-bottom-width':dataTb.css('border-bottom-width'),

'overflow':'hidden',

'height':dataTb.attr('offsetHeight'),

'width':dataTb.find('td').first().attr('offsetWidth') + 2,

'border-collapse':dataTb.css('border-collapse')

});

newTb.offset(dataTb.offset());

var oldTrs = dataTb.find('tr');

var newTbody = newTb.find('tbody');

var adjust1 = 0;

var adjust2 = 0;

if ($.browser.msie){

if($.browser.version == '8.0'){

adjust1 = 1;

}

}

else if($.browser.mozilla){

adjust2 = 4;

}

oldTrs.each(function(i){

var currentTD = $(this).children().first();

var newTr = $('

' + currentTD.html() + '');

newTr.css({

'background-color':currentTD.css('background-color')

});

newTr.find('td').css({

'font-weight':currentTD.css('font-weight'),

'font-size': currentTD.css('font-size'),

'color': currentTD.css('color'),

'background-color':currentTD.css('background-color'),

'padding-left': currentTD.css('padding-left'),

'padding-right': currentTD.css('padding-right'),

'padding-top': currentTD.css('padding-top'),

'padding-bottom': currentTD.css('padding-bottom'),

'margin-left': currentTD.css('margin-left'),

'margin-right': currentTD.css('margin-right'),

'margin-top': currentTD.css('margin-top'),

'margin-bottom': currentTD.css('margin-bottom'),

'height': parseInt(currentTD.css('height')) + adjust2,

'overflow': 'hidden',

'border-left-color':currentTD.css('border-left-color'),

'border-right-color':currentTD.css('border-right-color'),

'border-top-color':currentTD.css('border-top-color'),

'border-bottom-color':currentTD.css('border-bottom-color'),

'border-left-style':currentTD.css('border-left-style'),

'border-right-style':currentTD.css('border-right-style'),

'border-top-style':currentTD.css('border-top-style'),

'border-bottom-style':currentTD.css('border-bottom-style'),

'border-left-width':currentTD.css('border-left-width'),

'border-right-width':currentTD.css('border-right-width'),

'border-top-width':currentTD.css('border-top-width'),

'border-bottom-width':currentTD.css('border-bottom-width')

});

newTbody.append(newTr);

});

newTb.find('td').first().height(40-1);

});