[jQuery] height - CSS

<style>
#rect0{
  margin:10px;
  width:100px;
  height:100px;
  display:block;
  padding:8px;
  background-color:#aaa;
}
</style>

$('#btn0').click(function(){
  $('#input0').val( 'document height : ' + $(document).height() + 'px' );
  $('#input1').val( 'window height : ' + $(window).height() + 'px' );
  $('#input2').val( 'div height : ' + $('#rect0').height() + 'px' );
  $('#input3').val( 'p height : ' + $('#rect0 p').height() + 'px' );
});

.height() return number
指定した要素の高さを取得する

id = rect0

高さを取得する

<style>
#rect1{
  margin:10px;
  width:100px;
  height:100px;
  display:block;
  padding:8px;
  background-color:#aaa;
}
</style>

$('#btn1').click(function(){
  $('#rect1').height(300);
  $('#input4').val( 'div height : ' + $('#rect1').height() + 'px' );
});

.height( value:number )
指定した要素の高さを設定する

id = rect1

高さを設定する

<style>
#rect2{
  margin:10px;
  width:100px;
  height:100px;
  display:block;
  padding:8px;
  background-color:#aaa;
}
</style>

$('#btn2').click(function(){
  $('#rect2').height( function(index,value){
    return value + 100;
  } );
  $('#input5').val( 'div height : ' + $('#rect2').height() + 'px' );
});

.height( function( index:int, value:number ):function )
指定した要素の高さを設定する

id = rect2

高さを設定する