最近在開發的過程中,遇到有需求,讓固定gridview的頭,以及指定的列,在網上看了很多的資料,發現基本上都是采用css來實現,本人借薦了其它牛人的一些方法,整理了一下發在這裡。
<style>
.FixedTitleRow
{
position: relative;
top: expression(this.offsetParent.scrollTop);
z-index: 10;
background-color: #E6ECF0;
}
.FixedTitleColumn
{
position: relative;
left: expression(this.parentElement.offsetParent.scrollLeft);
}
.FixedDataColumn
{
position: relative;
left: expression(this.parentElement.offsetParent.parentElement.scrollLeft);
background-color: #E6ECF0;
}
</style>
<div id="scrollDiv" style="width: 400px; overflow: auto; ">
<table id="content" width="100%" border="1" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<asp:GridView ID="grvQuery" runat="server" OnRowDataBound="grvQuery_RowDataBound"
Width="100%">
</asp:GridView>
</td>
</tr>
</table>
</div>
protected void grvQuery_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowIndex == -1)//固定標題,以及固定第一列
{
e.Row.Attributes.Add("class", "FixedTitleRow");
e.Row.Cells[0].Attributes.Add("class", "FixedTitleColumn");
} else
{
e.Row.Cells[0].Attributes.Add("class", "FixedDataColumn");
}
}