プラグインなしでJavaScriptを使用してクライアント側で画像のサイズを変更する方法?

JavaScript を使用したクライアント側での画像のサイズ変更

画像の操作は Web 開発の重要な側面であり、画像のサイズを効率的に変更することは、ユーザー エクスペリエンスと Web サイトのパフォーマンスを最適化するために不可欠です。従来、画像のサイズ変更には Flash が使用されてきましたが、JavaScript の進歩により、追加のプラグインを必要とせずにクライアント側で画像のサイズを変更できるようになりました。

画像のサイズを変更するためのオープンソース ソリューションを探している開発者向けJavaScript では、次のリソースが堅牢で信頼性の高いオプションを提供します:

Github Gist:

この 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 中国語 Web サイトの他の関連記事を参照してください。