Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Mengubah Saiz Imej Bahagian Klien Menggunakan JavaScript tanpa Pemalam?

Bagaimana untuk Mengubah Saiz Imej Bahagian Klien Menggunakan JavaScript tanpa Pemalam?

Patricia Arquette
Patricia Arquetteasal
2024-10-19 10:38:02599semak imbas

How to Resize Images Client-Side Using JavaScript without Plugins?

Mengubah Saiz Imej Bahagian Klien Menggunakan JavaScript

Manipulasi imej ialah aspek penting dalam pembangunan web, dan mengubah saiz imej dengan cekap adalah penting untuk mengoptimumkan pengalaman pengguna dan prestasi tapak web. Flash secara tradisinya telah digunakan untuk mengubah saiz imej, tetapi dengan kemajuan dalam JavaScript, ia kini boleh mengubah saiz imej sebelah pelanggan tanpa memerlukan pemalam tambahan.

Untuk pembangun yang mencari penyelesaian sumber terbuka untuk mengubah saiz imej dalam JavaScript, sumber berikut menyediakan pilihan yang teguh dan boleh dipercayai:

Github Gist:

Intisari ini menawarkan kedua-dua versi ES6 dan JavaScript bagi algoritma saiz semula imej: https:// gist.github.com/dcollien/312bce1270a5f511bf4a.

Penggunaan:

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.
    });
};

Ciri:

  • Menyokong saiz semula pelbagai format imej.
  • Termasuk polyfill untuk memastikan keserasian dengan penyemak imbas lama.
  • Abaikan GIF animasi atas sebab keserasian.

Atas ialah kandungan terperinci Bagaimana untuk Mengubah Saiz Imej Bahagian Klien Menggunakan JavaScript tanpa Pemalam?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn