asp.net gridview指定某一列滚动

//基本代码设计
<div id="div-datagrid">
<asp:datagrid id="datagrid1" runat="server" cssclass="grid" useaccessibleheader="true">
<alternatingitemstyle cssclass="gridaltrow"></alternatingitemstyle>
<itemstyle cssclass="gridrow"></itemstyle>
<columns>
<asp:boundcolumn datafield="name" headertext="name"
itemstyle-wrap="false"></asp:boundcolumn>
<asp:boundcolumn datafield="address" headertext="address"
itemstyle-wrap="false"></asp:boundcolumn>
<asp:boundcolumn datafield="city" headertext="city"
itemstyle-wrap="false"></asp:boundcolumn>
<asp:boundcolumn datafield="state" headertext="state"
itemstyle-wrap="false"></asp:boundcolumn>
<asp:boundcolumn datafield="zip" headertext="zip"
itemstyle-wrap="false"></asp:boundcolumn>
<asp:boundcolumn datafield="random babble"
headertext="random babble"
itemstyle-wrap="false"></asp:boundcolumn>
</columns>
</asp:datagrid>
</div>

//可以给一个按钮触发lockcol('');
function lockcol(tblid) {
var table = document.getelementbyid(tblid);
var button = document.getelementbyid('toggle');
var ctr = table.getelementsbytagname('tr'); //collection of rows
if (table.rows[0].cells[0].classname == '') {
for (i = 0; i < ctr.length; i++)
{
var tr = ctr.item(i);
tr.cells[0].classname = 'locked'
}
button.innertext = "unlock first column";
} else {
for (i = 0; i < ctr.length; i++)
{
var tr = ctr.item(i);
tr.cells[0].classname = ''
}
button.innertext = "lock first column";
}
}





//css样式代码
/* div container to wrap the datagrid */
div#div-datagrid {
width: 420px;
height: 200px;
overflow: auto;
scrollbar-base-color:#ffeaff;
}
/* locks the left column */
td.locked, th.locked {
font-size: 14px;
font-weight: bold;
text-align: center;
background-color: navy;
color: white;
border-right: 1px solid silver;
position:relative;
cursor: default;
/*ie5+ only*/
left: expression(document.getelementbyid("div-datagrid").scrollleft-2);
}
/* locks table header 这里是表头不动,要表头动那就把这一段注释!*/
th {
font-size: 14px;
font-weight: bold;
text-align: center;
background-color: navy;
color: white;
border-right: 1px solid silver;
position:relative;
cursor: default;
/*ie5+ only*/
top: expression(document.getelementbyid("div-datagrid").scrolltop-2);
z-index: 10;
}
/* keeps the header as the top most item. important for top left item*/
th.locked {z-index: 99;}
/* datagrid item and alternatingitem style*/
.gridrow {font-size: 10pt; color: black; font-family: arial;
background-color:#ffffff; height:35px;}
.gridaltrow {font-size: 10pt; color: black; font-family: arial;
background-color:#eeeeee; height:35px;}



///指定那些不动!
sub item_bound(byval sender as object, byval e as datagriditemeventargs) _
handles datagrid1.itemdatabound
e.item.cells(0).cssclass = "locked"
//e.item.cells(1).cssclass = "locked"
end sub