Tbody Scrollbar问题

时间:2011-07-06 17:57:11

标签: html scrollbar

我有以下代码要修改,以便tbody可以在没有thead移动的情况下使用滚动条:

<table class="sortable">
<thead border="0" cellspacing="0" cellpadding="2" align="left" style="position:relative; bottom:-3px; left:0px;">
<tr>
<%
For i = 0 to Ubound(hdVals)
    if i = 0 then
        response.Write "<td class=""symbollng"" valign=""bottom"" style=""border-right:0px; border-left:0px;"">" & hdVals(i) & "</td>" & vbnewline
    elseif i = 1 then
        response.Write "<td class=""close-hd"" valign=""bottom"">" & hdVals(i) & "</td>" & vbnewline
    else
        dstrVals(i-2,0) = hdVals(i)
        response.Write "<td class=""col-hd-wd"" valign=""bottom"">" & hdVals(i) & "</td>" & vbnewline
    end if
Next
%>
</tr>
</thead>



<tbody class="scrollContent">
<%
EO = "odd"
For i = 1 to Ubound(tmpRows)-1  
    if EO = "odd" then
        response.Write "<tr class=""grey"">" & vbnewline
    else
        response.Write "<tr>" & vbnewline
    end if
    tmpRowVals1 = split(tmpRows(i),"=")
    tmpRowVals = split(tmpRowVals1(1),":")
    For j = 0 to Ubound(tmpRowVals)
        if j = 0 then
            response.Write "<td class=""symbollng""><span title=""" & tmpRowVals(j) & """>" & tmpRowVals(j) & "</span></td>" & vbnewline
        elseif j = 1 then
            if trim(tmpRowVals(j)) = "" then
                response.Write "<td class=""close"">&nbsp;</td>" & vbnewline
            else
                response.Write "<td class=""close""><span title=""" & tmpRowVals(j) & """>" & tmpRowVals(j) & "</span></td>" & vbnewline
            end if
        else
            Call addToDistChart(j-2,tmpRowVals(j))
            gTime = hdVals(j)
            response.Write getCellColorWithClick(curlv(tmpRowVals(j)),tmpRowVals(0),gSec,gChar,gTime)
        end if
    Next
    response.Write "</tr>" & vbnewline
    if EO = "odd" then
        EO = "even"
    else
        EO = "odd"
    end if
Next
%>
</tbody>
</table>

这是我到目前为止的设计图片:

enter image description here

希望自从处理表格以来我的代码中的一个小编辑很痛苦:(

2 个答案:

答案 0 :(得分:1)

fixedheadertable.com有一个非常简单的基于jQuery的解决方案。

答案 1 :(得分:0)

找到一个解决方案,它是一个jquery插件,它可以格式化表并自动检测列中的值,这些值可以正确地对它们进行排序。它还可以生成一个漂亮的ui界面,可以根据自己的喜好进行设计:

http://www.datatables.net/