layui hover显示图片

概述参考：Layui 数据表格显示图片，鼠标滑过图片放大 HTML img 刷新图片的问题 layer Tips的简单使用及图片显示 table.render({ elem: "#table_list", url: "/table", cols: [ [ { checkbox: true, fixed: true },

参考：Layui 数据表格显示图片，鼠标滑过图片放大

HTML img 刷新图片的问题

layer Tips的简单使用及图片显示

table.render({      elem: "#table_List",url: "/table",cols: [        [          { checkBox: true,fixed: true },{ fIEld: "ID",Title: "ID",align: "center",sort: true,wIDth: 50 },{ fIEld: "image",Title: "图片"},        ]      ],ID: "ListReload",page: true,height: "full-130",done:function(res,curr,count){        console.log("*****")            hoverOpenimg();//hover显示大图                  $(‘table tr‘).on(‘click‘,function(){              console.log("*****")                $(‘table tr‘).CSS(‘background‘,‘‘);                $(this).CSS(‘background‘,‘<%=PropKit.use("config.propertIEs").get("table_color")%>‘);            });        }    });     function hoverOpenimg(){          　 var img_show = null; // tips提示　　　　var kd,kd1    　　$(‘tbody tr‘).hover(function(){      　　　// console.log($(this)[0].childNodes[5].innerText)        　　kd=$(this).wIDth();        　　kd1=kd*0.2;          //图片放大倍数        　　var img = "<img class=‘img_msg‘ src=‘"+$(this)[0].childNodes[5].innerText+"?t"+Math.random()+"‘ style=‘wIDth:"+kd1+"px;‘ />";        　　img_show = layer.tips(img,".input-cont",{time:0,tips: [3,‘#ffffff‘]});        　　console.log(img)          },function(){        layer.close(img_show);    });    $(‘td img‘).attr(‘style‘,‘max-wIDth:50px;display:block!important‘);}

总结

以上是内存溢出为你收集整理的layui hover显示图片全部内容，希望文章能够帮你解决layui hover显示图片所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。