layui 列表图片

 table.render({
            elem: '#test-table-form'
            ,url:"{:url('/backend/MemberFriendDynamicsFictitious/getFictitiousMemberList')}"
            ,cellMinWidth: 80
            ,cols: [[
                {field:'id', title:'ID', width:100, unresize: true}
                ,{field:'nickname', title:'认证用户昵称111',}
                ,{field: 'member_img', title: '头像', align: "center",templet: function (d) {
                        return "<span><img class='imgs' id=\"pic_" + d.id + "\" src=\"" + d.member_img + "\"  style=\"width: 40px\" lay-event=\"showPic\" ></span>";
                    }},
                ,{field:'sex', title:'性别',templet:function(d){
                    if(d.sex == 1){
                        return d.sex = '男';
                    }else if(d.sex == 2){
                        return d.sex = '女';
                    }
                }}
                ,{field:'age', title:'年龄',}
                ,{field:'address', title:'位置',}
                ,{field:'lon', title:'经纬度',templet:function(d){
                    return d.lon = d.lon+','+d.lat;
                }}
                ,{field:'create_time', title:'创建时间',}
            ]]
            ,page: true
        });


        var area = [];
        if (window.screen.width > 1680 && window.screen.width <= 1920) {
            area = ['58%', '96%']
        } else if (window.screen.width > 1600 && window.screen.width <= 1680) {
            area = ['78%', '86%']
        } else if (window.screen.width > 1366 && window.screen.width <= 1600) {
            area = ['78%', '86%']
        } else if (window.screen.width <= 1366) {
            area = ['78%', '86%']
        }

        $(document).on('click','.imgs',function(){
            layer.open({
                type: 1,
                title: false,
                closeBtn: 0,
                shadeClose: true, //点击阴影关闭
                area: area , //宽高
                // area: [$(this).width + 'px', $(this).height + 'px'], //宽高
                content: "<img src=" + $(this).attr('src') + " />"
            });
        })

 

posted @ 2021-11-20 17:00  -韩  阅读(570)  评论(0编辑  收藏  举报