|
题目：
最近做项目统计的时辰遇见一个特定的需求，要求表格上下转动时，表格头尾牢靠；阁下转动的时辰表格，表格第一列最后一列牢靠。
先上结果图也许会更明白些：
阁下转动时，两列牢靠，头尾中间部门随着转动。
上下转动时，头尾牢靠，第一列和最后一列中间部门随着转动。
思绪：
思索了好久发明，假如纯真的用表格根基很难实现，上下转动的时辰存在彼此抵牾的处所。最后换了个思绪去用div机关，仿表格计划，来实现这样的结果。
办理：
1、整体机关：分为上中下三部门，即header,body,footer三个部门。body固高。实现上下转动。是不是很简朴，哈哈。
2、header机关：分为left container right，left10%宽度左浮动，container80%宽度左浮动，right10%宽度左浮动。container内里加一个数据现实宽度的容器column-container（相对定位）。
3、body，footer同header。
4、控件焦点：天生一个宽度同container同宽的（80%）div，内里安排一个同column-container现实数据宽度沟通的div（如id=Scroll）。来模仿阁下转动条。
JavaScript Code复制内容到剪贴板
$("#Scroll").scroll(function () {
var scrollLeft = $(this).scrollLeft();
$(".column-container").css({ "left": -scrollLeft + "px" });
});
即，模仿的转动条去节制header body footer 中的column-container转动。这样就实现了阁下转动时牢靠了两列，同时头尾行的container也随着转动。
结语：
因为代码样式等贴出来太冗长了，在这里就只说说思绪了，下手试试吧。 （编辑：湖南网）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
|
