0

これは、サイズ変更およびトリミングされた画像を CSS で表示するの続きです。そこの答えはそのユーザーにとっては問題ないようですが、その答えを改善するために助けが必要です...

Q: サイズ変更 (スケール) は、実行時の画像のサイズにどのように関連していますか? つまり、「幅: 320px; 高さ: 221px;」のようなコードをハードコーディングしたくありません。スタイルで - 前もって画像の寸法を知っている場合に機能します。

ここにいくつかのjsfiddlesがあります:

http://jsfiddle.net/VdX68/ - 元のスレッドの回答に基づいています。画像の寸法が前もってわかっている場合に機能します。

http://jsfiddle.net/VdX68/4/ - 画像の寸法を知る必要はありませんが、100% スケールでのみ機能します。(ここでは、.scalePan クラスから幅と高さを単純に削除しました。

http://jsfiddle.net/VdX68/2/ - 幅と高さを % として使用。これにより、画像の元のサイズではなく、含まれる div のサイズに画像がスケーリングされます。

画像が入っているコンテナの%ではなく、元の寸法の%に画像を拡大縮小する方法を探しています.

どんな助けでも大歓迎です。

4

1 に答える 1

-1

あなたがこれをやりたいと思っていることは理解していますが、完全にはわかりません。

$(document).ready(function() {
    var wdth = $('img').width();
    var hght = $('img').height();

    $('img').css('width',  wdth / 100 * 90 + "px"); // new width is 90% width of image
    $('img').css('height', hght / 100 * 70 + "px"); // new height 70% height of image
});

実例: http: //jsfiddle.net/VdX68/18/

JQueryを使用する必要はありません。これは、通常のjavascriptでも実行できます。

于 2012-06-22T12:16:43.010 に答える