壹佰网|ERP100 - 企业信息化知识门户

 找回密码
 注册

QQ登录

只需一步,快速开始

查看: 369|回复: 0

固定表头的JS

[复制链接]
发表于 2012/3/7 15:11:43 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。如果您注册时有任何问题请联系客服QQ: 83569622  。

您需要 登录 才可以下载或查看,没有帐号?注册

x
一)添加全局类
.zdy25 /*自定义固定列标题*/
{
padding:3px 5px 3px 5px;
text-align:center;
vertical-align:middle;
white-space:nowrap;
line-break:strict;
color:#0376B4;
font-size:10pt;
background-color:#D2E2FB;
border:1pt solid #759EDE;
border-left-style:none;
position:relative;
top: expression(this.offsetParent.scrollTop); /*IE5+ only*/
z-index: 1;
}

.zdy26 /*自定义固定行标题*/
{
padding:3px 5px 3px 5px;
text-align:left;
vertical-align:middle;
white-space:nowrap;
line-break:strict;
color:#0376B4;
font-size:10pt;
background-color:#EBF6FA;
border:1pt solid #759EDE;
border-top-style:none;
position:relative;
left: expression(this.offsetParent.scrollLeft); /*IE5+ only*/
z-index: 1;
}

.zdy27 /*自定义固定行标题-合计*/
{
padding:3px 5px 3px 5px;
text-align:center;
vertical-align:middle;
white-space:nowrap;
line-break:strict;
color:#0376B4;
font-size:10pt;
font-weight:bold;
background-color:#EBF6FA;
border:1pt solid #759EDE;
border-top-style:none;
position:relative;
left: expression(this.offsetParent.scrollLeft); /*IE5+ only*/
z-index: 1;
}

.zdy28 /*自定义固定交叉表角*/
{
padding:3px 5px 3px 5px;
text-align:center;
vertical-align:middle;
white-space:nowrap;
line-break:strict;
color:#0376B4;
font-size:10pt;
background-color:#D2E2FB;
border:1pt solid #759EDE;
position:relative;
top: expression(this.offsetParent.scrollTop); /*IE5+ only*/
left: expression(this.offsetParent.scrollLeft); /*IE5+ only*/
z-index: 2;   /*务必大于列标题样式和行标题样式中的值,表示置于顶层的含义*/
}

二)页面布局:



1.在块中插入列表,依次放入数据项。设置块的高度为450.
2.在表格前加入html项目,写入如下:<div style="position:absolute;left:60px;top:68px;width:913px;height:420px;overflow: auto;">
表格后加入html项目,写入如下:</div>
3.选中列表列标题,设置类为固定表头和固定列表列标题即可。

这两个类也可以写成自定义类。
建新自定义类,然后工具--复制到剪贴-把新建 的类的内容改成上边的就可以了。

该贴已经同步到 xiaoerp的微博
您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|Archiver|小黑屋|手机版|壹佰网 ERP100 ( 京ICP备19053597号-2 )

Copyright © 2005-2012 北京海之大网络技术有限责任公司 服务器托管由互联互通
手机:13911575376
网站技术点击发送消息给对方83569622   广告&合作 点击发送消息给对方27675401   点击发送消息给对方634043306   咨询及人才点击发送消息给对方138011526

GMT+8, 2025/11/29 22:59 , Processed in 0.016061 second(s), 14 queries , File On.

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表