如何在不使用外掛程式的情況下使用 JavaScript 調整客戶端圖像大小？

使用JavaScript 在客戶端調整圖像大小

圖像操作是Web 開發的一個重要方面，有效地調整圖像大小對於優化用戶體驗和網站性能至關用戶體驗和網站性能至關重要。 Flash 傳統上用於調整圖像大小，但隨著 JavaScript 的進步，現在可以在客戶端調整圖像大小，而無需額外的插件。

對於尋求開源解決方案來調整圖片大小的開發人員JavaScript，以下資源提供了強大且可靠的選項：

Github Gist：

此要點提供了圖像調整大小算法的ES6 和JavaScript 版本：https:// gist.github.com/dcollien/312bce1270a5f511bf4a.

用法：

document.getElementById('select').onchange = function(evt) {
    ImageTools.resize(this.files[0], {
        width: 320, // maximum width
        height: 240 // maximum height
    }, function(blob, didItResize) {
        // didItResize will be true if it managed to resize it, otherwise false (and will return the original file as 'blob')
        document.getElementById('preview').src = window.URL.createObjectURL(blob);
        // you can also now upload this blob using an XHR.
    });
};

功能：

• 支援調整各種影像格式的大小。
• 包括填充以確保與舊版瀏覽器的兼容性。
• 出於相容性原因忽略動畫 GIF。

以上是如何在不使用外掛程式的情況下使用 JavaScript 調整客戶端圖像大小？的詳細內容。更多資訊請關注PHP中文網其他相關文章！