当前位置: 首页 前端

layui表格高度自适应,一般行内存在图片元素可使用

栏目:前端 作者:xiaofan 时间:2024-09-02 14:56:45

css样式

.layui-table-cell {
    overflow: visible;
    text-overflow: inherit;
    white-space: normal;
    height: auto !important;
    word-break: break-all;}
CSS

table表属性,动态监听改变行高

done: function (res, curr, count) {
    //动态监听表头高度变化,冻结行跟着改变高度
    $(".layui-table-header tr").resize(function () {
        $(".layui-table-header  tr").each(function (index, val) {
            $($(".layui-table-fixed .layui-table-header table tr")[index]).height($(val).height());
        });
    });
    //初始化高度,使得冻结行表头高度一致
    $(".layui-table-header tr").each(function (index, val) {
        $($(".layui-table-fixed .layui-table-header table tr")[index]).height($(val).height());
    });
    //动态监听表体高度变化,冻结行跟着改变高度
    $(".layui-table-body tr").resize(function () {
        $(".layui-table-body  tr").each(function (index, val) {
            $($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height());
        });
    });
    //初始化高度,使得冻结行表体高度一致
    $(".layui-table-body tr").each(function (index, val) {
        $($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height());
    });},
JavaScript

效果


阅读:197次

分类栏目