固定表頭怎么弄?
如果Table數(shù)據(jù)過多,頁面必然會(huì)拉的很長(zhǎng),固定表頭,可以方便用戶對(duì)照表頭項(xiàng)目列表。近日做后臺(tái)界面時(shí),整理固定表頭三種方法:
A:使用JQuery UI插件,用DIV替換table,overflow-y:hidden達(dá)到滾動(dòng),讓 thead絕對(duì)定位達(dá)到固定的目的,方法如下:
+ VIEw Code頁面調(diào)用如下:
+ View Code
此方法IE和FF的兼容性都很好,推薦。
B:利用css濾鏡實(shí)現(xiàn),但FF不支持微軟的東西,不兼容。DOM如下:
+ View Code
C:最簡(jiǎn)單的方法當(dāng)然是寫2個(gè)table,用DIV的overflow-y:auto來實(shí)現(xiàn),兼容性絕對(duì)沒問題,麻煩之處在于2個(gè)table的對(duì)齊問題,另外用腳本賦予高度的話,需要加onresize()方法。DOM如下:
+ View Code
有時(shí)候最笨的方法也可能是最簡(jiǎn)單最好的方法,這樣寫的兼容性絕對(duì)安全,靈活性也不錯(cuò)。