[toc]  ## 實現 - public/assets/js/backend-init.js 加入以下代碼 ``` $('body').on('click', '[data-tips-image]', function () { var img = new Image(); var imgWidth = this.getAttribute('data-width') || '480px'; img.onload = function () { var $content = $(img).appendTo('body').css({ background: '#fff', width: imgWidth, height: 'auto' }); Layer.open({ type: 1, area: imgWidth, title: false, closeBtn: 1, skin: 'layui-layer-nobg', shadeClose: true, content: $content, end: function () { $(img).remove(); }, success: function () { } }); }; img.onerror = function (e) { }; img.src = this.getAttribute('data-tips-image') || this.src; }); ``` - 然后給img標簽加一個屬性`data-tips-image`即可 ``` <img src="xxx" data-tips-image /> ``` ### 給`bootstrapTable`列圖片加入效果 - public/assets/js/require-table.js 找到 `api.formatter.image/s` 給img標簽加入`data-tips-image` 如下 ``` return '<a href="javascript:"><img class="' + classname + '" src="' + Fast.api.cdnurl(value) + '" data-tips-image /></a>'; ```