好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

html实现固定表格四周并且可以上下左右滚动

这篇文章主要为大家详细介绍了固定表格四周实现表格上下左右滚动的解决方法,表格上下滚动时,表格头尾固定;左右滚动的时候表格,表格第一列最后一列固定,本文为大家提供了思路,感兴趣的小伙伴们可以参考一下

JavaScript Code 复制内容到剪贴板

$( "#Scroll" ).scroll( function () {

var scrollLeft = $( this ).scrollLeft();

$( ".column-container" ).css({ "left" : -scrollLeft + "px" });

});

即,模拟的滚动条去控制header body footer 中的column-container滚动。这样就实现了左右滚动时固定了两列,同时头尾行的container也跟着滚动。

结语:

由于代码样式等贴出来太冗长了,在这里就只说说思路了,动手试试吧。

【相关推荐】

1. HTML免费视频教程

2. 详解前端开发常用的HTML标签

3. 通过marquee标签完成滚动效果的纯html代码

4. 用HTML编写个人简历的代码实例

5. 分享三种创建新元素的方法

以上就是html实现固定表格四周并且可以上下左右滚动的详细内容,更多请关注Gxl网其它相关文章!

查看更多关于html实现固定表格四周并且可以上下左右滚动的详细内容...

  阅读:65次