页面特效 UI组件库 菜单导航 窗口特效 幻灯片滑动 图像相册 表单 选项卡 表格 评分星级 手风琴 文本链接 布局 日历 颜色选择器 按钮 图表 html5 提示 ExtJS 在线客服 其他特效 地图 树形控件 移动开发 BootStrap 滑动条 文件上传 表单验证 分页 播放器 Angular VUE

jQuery固定表头插件freezeheader.js

表格 HTML我帮您 25天前  次浏览

     在页面显示时,如果一页显示的表格内容很多,超过一页,那么就会出现滚动条,在滚动查看下面的记录时,表头也滚动到上面,并且隐藏,这样就无法直观看到哪列数据的表头是什么含义。freezeheader.js是一个简单的jQuery固定表头表格插件。有三种固定表头的表格效果可以使用。

jQuery固定表头插件freezeheader.js

解决方法

1.方法1

    可以让表格内容只显示一页,不会出现滚动条,通过分页条,点击下一页进行查看

2.方法2

    固定表头,这样无论内容滚动到哪里,都可以看到表头
使用方法

1.在页面中引用:

<script src="/path/ jquery.freezeheader.js"></script>

<script src="/path/ jquery.js"></script>

 

2.给table设置id属性

<table id="tableid"

 

3.1表格头部固定在浏览器顶部

    $(document).ready(function () {
        $("#tableid").freezeHeader();
    })

3.2设置表格的高度

这种情况可以把表格的高度设置为单页显示的高度,这样表头一直会在页面内

    $(document).ready(function () {
        $("#tableid").freezeHeader({ 'height': '300px' });
    })
 
 

相关链接

发表评论