頁面圖片點選後的顯示效果
阿新 • • 發佈:2018-11-10
{
field: "filepath1",
title: "整改前圖片",
sortable: false,
width: 135,
align: 'center',
headalign: 'center',
formatter: function formatterdate(val, row) {
var s = "";
if (val) {
var pathArr = val.split(",");
for (var i = 0; i < pathArr.length; i++) {
if (pathArr[i]) {
var k = zh(pathArr[i]);
s = s + '<img width="20px" height="20px" src="' + k + '" onclick="sybig(this)" />';
}
}
}
return s;
}
}
//點選放大後圖片的效果(跳轉到另一個頁面大圖顯示) function ytbig(obj) { var o = obj.src; var s = o.substring(o.lastIndexOf(".")); var d = o.substring(0, o.lastIndexOf("_")); var k = d + "_yt" + s; window.open(k); }
<script type="text/javascript">
//獲取到圖片路徑 function zh(o) { var s = o.substring(o.lastIndexOf(".")); var d = o.substring(0, o.lastIndexOf("_")); var k = d + "_min" + s; return k; } //點選內容事件(放大在當前頁面的一個放大鏡效果) function sybig(obj) { var o = obj.src; var s = o.substring(o.lastIndexOf(".")); var d = o.substring(0, o.lastIndexOf("_")); var k = d + "_sy" + s; layer.open({ zIndex: 1, type: 1, area: ['300px', '300px'], title: false, closeBtn: 0, skin: 'layui-layer-nobg', //沒有背景色 shadeClose: true, content: '<img width="300px" height="300px" src="' + k + '" onclick="ytbig(this)"/>', }); }
//點選放大後圖片的效果(跳轉到另一個頁面大圖顯示) function ytbig(obj) { var o = obj.src; var s = o.substring(o.lastIndexOf(".")); var d = o.substring(0, o.lastIndexOf("_")); var k = d + "_yt" + s; window.open(k); }
</script>