首先将GridView放到下面的Div中:
<
div
id
="div_info"
style
="overflow:auto;width:200px;height:100px"
>
</ div >
</ div >
然后设置GridView的HeaderStyle-CssClass="FixedHeader"
FixedHeader的CSS代码如下:
CSS
.FixedHeader
{}{
position: relative;
top: expression(this.offsetParent.scrollTop);
background-color: blue;
height: 25px;
color: #ffffff;
text-align: center;
vertical-align: middle;
font-weight: bold;
font-size: 13px;
background-color: #5D7B9D;
}
.FixedHeader
{}{
position: relative;
top: expression(this.offsetParent.scrollTop);
background-color: blue;
height: 25px;
color: #ffffff;
text-align: center;
vertical-align: middle;
font-weight: bold;
font-size: 13px;
background-color: #5D7B9D;
}
以上就保证的在GridView显示滚动条的同时,横向标题不会变化,下面加入一段JavaScript代码保证此GridView只显示纵向滚动条
JavaScript代码如下:
JavaScript
//保证只显示垂直方向上的滚动条
function chkFlow() {
var o = document.getElementById("div_info");
if (o.scrollWidth > o.offsetWidth) {
o.style.overflowX = "scroll";
}
else {
o.style.overflowX = "hidden";
}
}
//保证只显示垂直方向上的滚动条
function chkFlow() {
var o = document.getElementById("div_info");
if (o.scrollWidth > o.offsetWidth) {
o.style.overflowX = "scroll";
}
else {
o.style.overflowX = "hidden";
}
}
此段脚本可放在页面加载的事件里,如body的onload事件