2012-08-22 291 views
3

我有一個很高的html表。網頁必須垂直滾動才能到達表格底部的滾動條。如果我可以在用戶滾動頁面並且表格可見的時候在瀏覽器窗口的底部浮動表格的水平滾動條,那將會很好。能做這樣的事情嗎?html表的浮動水平滾動條

這裏的情況的jsfiddle例如:http://jsfiddle.net/RurTZ/1/

+0

看看http://www.matts411.com/post/super_tables/和http://stackoverflow.com/questions/12075757/floating-horizo​​ntal-scroll-bar-for-html-table –

+0

這對問題沒有多大幫助,但避免水平滾動是一種很好的做法。它真的讓用戶感到不安。 – Samuel

+0

你能告訴我們一些代碼嗎?應該很容易與普通的CSS和HTML,但取決於情況...一個小提琴會更好! – Pevara

回答

2

是,將它放在一個<div>標籤內,並添加overflow:scroll;到div的風格。

+0

這似乎不起作用。我有table'height:100%'和wrap'div overflow:scroll',但滾動條只出現在表格的最底部 – Alex

+2

正如Alex所說,這是獲得水平滾動條的正確答案(並且在此垂直滾動可能也是如此),但它沒有解決如何使水平滾動條浮動的真正問題。 –

3

@KDavid的Grid建議很好,但是如果您要找的東西更輕一點,我已成功使用floatingScrollbar jQuery plugindemo)。

確保插件JS被加載後,神奇的通話情況:

$('.your-div').floatingScrollbar(); 

我也不得不把DIV + CSS設置爲:

.your-div { 
    overflow-x: auto; 
    width: 100%; 
} 

這是您的jsfiddle的用叉子它的工作:http://jsfiddle.net/RxTQM/1/