2013-03-29 67 views
0

我使用position:fixed漂浮在我的表中的一些標題,當用戶滾動經過上,阿拉這個方法:http://css-tricks.com/persistent-headers/容器溢出時浮動表標題?

一切都在常規頁面的偉大工程,但每當我有另一格或東西的內表與固定的高度和overflow:auto它爆炸壯觀。

我需要做什麼來解釋不僅僅是頁面範圍的滾動,還有我的容器的滾動?並考慮滾動通過所述容器的「頂部」?

感謝你們可以點我在任何方向

這裏是我現有的代碼:

var mainheader = table.rows[0]; 
var tableHeight = table.getHeight(); 
var tableScroll = table.viewportOffset(); 
var headerHeight = mainheader.getHeight(); 

// TODO: If we're scrolling a subcontainer, we need to get the offset for that too! Somehow? 

// If tableHeight < 1, it means our table his hidden right now, so skip it 
if (tableHeight < 1) 
    continue; 

// If we've scroll down past the very tip top of the table, but haven't yet scroll past the end of it, show our floating headers 
if (tableScroll.top < 0 && tableHeight + tableScroll.top - headerHeight > 0) 
{ 
    table.floatingheader.style.display = ''; 

    // Handle horizontal scrolling too! 
    table.floatingheader.style.left = (tableScroll.left + 1) + 'px'; // 1px offset for border 
} 
else 
    table.floatingheader.style.display = 'none'; 

注:我有機會獲得的prototype.js,但沒有的jQuery或任何其他第三黨的圖書館。 :/

回答

1

我知道你不使用jQuery的,但你可能想看看在github上這個傢伙的代碼,看看他是如何實現它,然後修改它爲您的目的:http://webpop.github.com/jquery.pin/

+0

這正是我需要的。謝謝! – DOOManiac