|
@@ -13,7 +13,7 @@
|
|
</head>
|
|
</head>
|
|
<body>
|
|
<body>
|
|
<h1>粘贴图片并展示</h1>
|
|
<h1>粘贴图片并展示</h1>
|
|
-<p>右键粘贴图片,本地图片或网络图片地址都可以,将被压缩为webp格式并展示</p>
|
|
|
|
|
|
+<p>右键粘贴图片,本地图片或网络图片地址都可以,将被压缩为webp格式并展示<span id="status"></span></p>
|
|
<div id="image-container">
|
|
<div id="image-container">
|
|
<img id="image-display" src="" alt="Image Display">
|
|
<img id="image-display" src="" alt="Image Display">
|
|
</div>
|
|
</div>
|
|
@@ -37,6 +37,7 @@
|
|
|
|
|
|
// 将图片展示
|
|
// 将图片展示
|
|
imageDisplay.src = imageUrl;
|
|
imageDisplay.src = imageUrl;
|
|
|
|
+ document.getElementById("status").innerText = " 压缩中……";
|
|
|
|
|
|
// 压缩为webp格式
|
|
// 压缩为webp格式
|
|
const image = new Image();
|
|
const image = new Image();
|
|
@@ -50,6 +51,7 @@
|
|
// 将压缩后的webp图片展示在页面上
|
|
// 将压缩后的webp图片展示在页面上
|
|
const webpUrl = URL.createObjectURL(webpBlob);
|
|
const webpUrl = URL.createObjectURL(webpBlob);
|
|
imageDisplay.src = webpUrl;
|
|
imageDisplay.src = webpUrl;
|
|
|
|
+ document.getElementById("status").innerText = " 已压缩☺";
|
|
|
|
|
|
}, "image/webp", 0.8);
|
|
}, "image/webp", 0.8);
|
|
};
|
|
};
|