innerHeight()


version 1.2.6 以降

解説

最初にマッチした要素の、padding を含めた現在の高さを返します。

概念図

jquery dimensions height

戻り値

  • Integer: padding を含めた要素の高さ (ピクセル)

関連


例1:CSS を切り替えて、高さを表示します。

/* --- CSS --- */
.block {
    width: 200px;
    height: 200px; 
}

.margin  { margin:        20px; }
.border  { border-width:  20px; }
.padding { padding:       20px; }
.height  { height:       240px; }
$("#test1 :button").click(function(){
    var block = $(".block");

    // CSS クラスを切り替え
    block.toggleClass($(this).val());

    // 高さを表示
    block.html(
        "height(): "          + block.height()          + "<br/>" +
        "innerHeight(): "     + block.innerHeight()     + "<br/>" +
        "outerHeight(): "     + block.outerHeight()     + "<br/>" +
        "outerHeight(true): " + block.outerHeight(true)
    );
});

テスト1