1

私は写真共有サイトに取り組んでいます。画像をフルサイズで表示する場合は、幅を最大800ピクセル、高さを最大600にしたいと思います。

以下のコードはスケーリングには機能しますが、画像の比率は維持されません。代わりにパーセンテージを使用できると思いますが、それでも画像にこれらの特定の最大値（h：800、w：600）を持たせたいと思います。

jQueryでそれを達成する方法はありますか？

前もって感謝します！

    if ($('#photo').length > 0) {
        var imgWidth = $("#photo").width();
        var imgHeight = $("#photo").height();

        if (imgWidth > 800) {
            $("#photo").width(800);
        }
        if (imgHeight > 600) {
            $("#photo").height(600);
        }
    }
4

3 に答える 3

4

あなたが使うことができる max-widthかmax-height

于 2012-05-14T20:34:38.237 に答える
1

重要なのは、幅と高さの両方に同じスケーリング定数を掛けることです。

幅で制限する場合は、800/幅を掛けます。

高さで制限している場合は、600/高さを掛けます。

于 2012-05-14T20:33:49.017 に答える
1

このようなもの：

var imgWidth = $("#photo").width();
var imgHeight = $("#photo").height();
var maxWidth = 800;
if (imgWidth > maxWidth) {
    var newWidthMultiplier = maxWidth / imgWidth;
    $("#photo").width(maxWidth);
    $("#photo").height(newWidthMultiplier * imgHeight);
}
于 2012-05-14T20:34:06.890 に答える