layui数据表格横向滚动条位置调整滚动条位置在合计下⽅layui 数据表格横向滚动条位置
调整滚动条位置在合计下⽅
查阅layui table 源码得知其处理如下:
所以我们反向处理⼀下同步就⾏:
1. 样式调整
<style>
.
layui-table-total{
overflow: auto;
}
.layui-table-body{
overflow-x: hidden;
}
html横向滚动条样式
</style>
2. 监听下⽅滚动条,并同步
//同步滚动条
let layTotal =$("[lay-id='salary'] .layui-table-total")
let layHeader =$("[lay-id='salary'] .layui-table-header")
let layFixBody =$("[lay-id='salary'] .layui-table-fixed .layui-table-body")
let layBody =$("[lay-id='salary'] .layui-table-body")
layTotal.scroll(function(){
let othis =$(this)
,scrollLeft = othis.scrollLeft()
,scrollTop = othis.scrollTop();
layHeader.scrollLeft(scrollLeft);
layBody.scrollLeft(scrollLeft);
// layFixBody.scrollLeft(scrollLeft);
})
最终效果如下:

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。