2014-03-02 41 views
1

我有3個表,我想以後滾動更多然後具體的距離來解決這些問題的一個表需要滾動

var distance = $("#thead").offset().top; 
    $(window).scroll(function() { 
     var wdistance = $(window).scrollTop(); 
     if (wdistance > distance) { 

     }; 
    }) 

演示jsfiddle

我想在這個「如果要說期間爲固定的「是正確的,那麼在滾動頁面時,」thead「id的div位置將固定在其他表格的頂部。並在id爲「first」的div完成後<div id="thead"></div>回到上一個地方。

回答

1

您可以創建一個.fixed類,並添加/從#thead元素刪除到/如下:

CSS

* { padding: 0; margin: 0; } /* Tiny reset for removing paddings and margins */ 

.fixed { 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
} 

需要注意的是,你必須刪除填充/保證金從<body>元素調整每列的寬度(當定位#thead時)。

或者對於定位的#thead元素也使用相同的填充/餘量。

var $table = $("#thead"), 
    $window = $(window), 
    distance = $table.offset().top; 

$window.scroll(function() { 
    var wdistance = $window.scrollTop(); 

    if (wdistance > distance) { 
     $table.addClass('fixed'); 
    } else { 
     $table.removeClass('fixed'); 
    } 
}); 

WORKING DEMO

+0

你的代碼是正確的,但它不起作用在我的佈局。我沒有自己寫佈局,所以面對很多問題,我不知道爲什麼他們正在發生 – mkafiyan

+0

@mimi我只是用你的jsfiddle演示來回答這個問題。如果它不是你的佈局,那麼你應該用你的確切代碼更新小提琴。 –

+1

我發現問題:D因爲z-index滾動時我無法看到表格!謝謝 – mkafiyan