我正在为我的表使用这个 JQuery 代码。
$(document).ready(function () {
var tableBottom = $(window).height() - $('#compare-table').height();
$(window).scroll(function (event) {
var y = $(this).scrollTop();
var tableTop = $('#compare-table').offset().top;
if (y >= tableTop && y <= tableBottom) {
$('#compare-table-controller').addClass('fixed');
$('#compare-table-controller').css('margin-top', '-' + tableTop + 'px');
} else {
$('#compare-table-controller').removeClass('fixed');
$('#compare-table-controller').css('margin-top', '0px');
}
});
var compareTableHeight = $('#compare-table > table').height() + 1;
var compareTableTotalColumn = $('#compare-table > table').width() / 195;
$('#compare-table').css('height', compareTableHeight);
alert($('#compare-table > table').width());
});
出于某种原因,alert() 在 chrome 和 firefox 上给了我不同的值。我正在使用 chrome 28.0.1500.71 和 firefox 22.0。正确的值应该是 1170px。
结果,所有 6 列都显示在 Firefox 上。它应该只显示 4 并隐藏其他 2。
我显示的 div 的 CSS 是。
#compare-table-h {
width: 780px;
overflow: hidden;
position:fixed;
height: 213px;
z-index: 999;
}
#compare-table {
width: 780px;
overflow: hidden;
position:relative;
margin-top: 213px;
}
div里面的表格是
<table id="compare-table-head" class="table font-size-12 compare-table table-striped" style="position:absolute; border-bottom:1px solid #ddd; width: 1170px;">
第一张桌子工作正常,第二张桌子不行