3

これは、CSS の幅/高さ、または属性の幅/高さを使用しないサイズ変更です。1024x768 である必要がある jpg 画像をサーバーに投稿していますが、投稿されている画像は、ユーザーの操作 (外部から読み込まれる) に基づいて他のサイズになる場合があります。

たとえば、1124x800 jpg 画像 tp 1024x768 のサイズを変更して、attr または css 値によって表示用にタグ付けされるだけでなく、実際にサイズ変更するにはどうすればよいですか????

これはキャンバスで実行できますか、それとも特別なjqueryプラグインが必要ですか?????? 感謝して受け取った助け。これはオープン ソース プロジェクトなので、商用プラグインを探しているわけではありません。

4

1 に答える 1

5

はい、これは で実行できます<canvas>。

function resize(img, width, height) {
    var canvas = document.createElement('canvas');
    var context = canvas.getContext('2d');

    canvas.width = width;
    canvas.height = height;

    context.drawImage(img, 0, 0, width, height);

    img.src = canvas.toDataURL('image/png');
}

JSFiddle を投稿しますが、サーバーがダウンしているようです。使い方はこちら。

var image = document.getElementById('myImage');

resize(image, image.width * 0.75, image.height * 0.75);

ただし、コメントで述べたように、これはブラウザで大きな画像を集中的に使用します。

注:これは、ローカルでホストされているイメージでのみ実行できます。src別のドメインからの画像を渡そうとすると、 SECURITY_ERR: DOM.

于 2012-12-29T23:38:35.090 に答える