溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章給大家介紹Layui點擊圖片彈框預覽的實現，內容非常詳細，感興趣的小伙伴們可以參考借鑒，希望對大家能有所幫助。
<img src="123.png" width="20px" height="20px" class="layui-upload-img" onclick="previewImg(this)">
function previewImg(obj) {
var img = new Image();
img.src = obj.src;
//var height = img.height + 50; // 原圖片大小
//var width = img.width; //原圖片大小
var imgHtml = "<img src='" + obj.src + "' width='500px' height='500px'/>";
//彈出層
layer.open({
type: 1,
shade: 0.8,
offset: 'auto',
area: [500 + 'px',550+'px'], // area: [width + 'px',height+'px'] //原圖顯示
shadeClose:true,
scrollbar: false,
title: "圖片預覽", //不顯示標題
content: imgHtml, //捕獲的元素，注意：最好該指定的元素要存放在body最外層，否則可能被其它的相對元素所影響
cancel: function () {
//layer.msg('捕獲就是從頁面已經存在的元素上，包裹layer的結構', { time: 5000, icon: 6 });
}
});
} //另外打開一個頁面顯示圖片
function previewImg(obj) {
window.open(obj.src);
}關于Layui點擊圖片彈框預覽的實現就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
