透過CSS設定,達到類似Excel凍結視窗的效果
直接看asp範例
<%@ Language=VBScript %>
<%
xcnt = 50
ycnt = 60
%>
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<style type="text/css">
.FixedTitleRow
{
position: relative;
top: expression(this.offsetParent.scrollTop-2);
z-index: 10;
background-color: #E6ECF0;
}
.FixedTitleColumn
{
position: relative;
left: expression(this.parentElement.offsetParent.scrollLeft-2);
}
.FixedDataColumn
{
position: relative;
left: expression(this.parentElement.offsetParent.parentElement.scrollLeft-2);
background-color: #E6ECF0;
}
</style>
</HEAD>
<BODY>
<div style="width:800px;height:560px;overflow:scroll;">
<Table border=1>
<tr class="FixedTitleRow">
<th class="FixedTitleColumn">xxxx1</th>
<th class="FixedTitleColumn">xxxx2</th>
<th class="FixedTitleColumn">xxxx3</th>
<%For x = 4 to xcnt%>
<th class="">th<%=x%></th>
<%Next%>
</tr>
<%For y = 1 to ycnt%>
<tr>
<td class="FixedDataColumn">xxxxyyyy</td>
<td class="FixedDataColumn">xxxxyyyy</td>
<td class="FixedDataColumn">xxxxyyyy</td>
<%For x = 4 to xcnt%>
<td>td<%=x%>,<%=y%></td>
<%Next%>
</tr>
<%Next%>
</table>
</div>
</BODY>
</HTML>
相同的方式,應該也可以用在ASP.NET的GridView裡面
ASP.NET的GridView請看這篇在GridView中使用CSS固定上、左表頭(似Excel凍結視窗)(限IE)(含操作錄影)
參考網址:http://www.chenjiliang.com/Article/View.aspx?ArticleID=1876&TypeID=30
以下是簽名:
- 歡迎轉貼本站的文章,不過請在貼文主旨上加上【轉貼】,並在文章中附上本篇的超連結與站名【topcat姍舞之間的極度凝聚】,感恩大家的配合。
- 小喵大部分的文章會以小喵熟悉的語言VB.NET撰寫,如果您需要C#的Code,也許您可以試著用線上的工具進行轉換,這裡提供幾個參考
Microsoft MVP Visual Studio and Development Technologies (2005~2019/6) | topcat Blog:http://www.dotblogs.com.tw/topcat |