How to calculate div height using JavaScript?

Question

I have develop some html page. I want to fit side menu when change page div height

<div>  <!-- menu div-->
</div> 
<div>  <!-- content div-->
</div>

When change content div height, want to change same height in menu div. When show hidden field change content div height, I want to adjust menu div height in same height. I looking for answer in jquery or JavaScript.

If you want to work with specific divs you will need to apply ID's to them. You can use pseudo-elements but it's not a good practice for this case. — Phiter
– Phiter, Commented Apr 8, 2016 at 13:19

Axel Couturier · Accepted Answer · 2016-04-08 13:23:13Z

2

See about https://api.jquery.com/resize/ and http://api.jquery.com/height/

$('div').height();

or

$('div').resize();

answered Apr 8, 2016 at 13:23

Axel Couturier

1685 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Alexey G · Accepted Answer · 2017-06-19 08:45:21Z

1

You can use bind/trigger for that:

$('#content-div').bind('heightChange', function(event, newHeight){
  $('#main-div').height(newHeight);
});

and trigger event on div height change:

var newHeight = 200;
$('#content-div').css('height', newHeight);
$("#content-div").trigger('heightChange', newHeight);

edited Jun 19, 2017 at 8:45

answered Apr 8, 2016 at 13:25

Alexey G

1,1181 gold badge14 silver badges18 bronze badges

Collectives™ on Stack Overflow

How to calculate div height using JavaScript?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related