How can I get the page height which can change after element hiding?

[eaglehopes]

Hi again, I am trying to find my page's height which changes when I hide(i.e. changing its height to 0pixel or by using element.style.display: "none")  one element inside it. I found solutions in google as :

<script>
  
  var h1,h2,h3,h4,h5 ; 
  var body = document.body, html = document.documentElement;
  h1 = body.scrollHeight; 
  h2= body.offsetHeight;
  h3= html.scrollHeight; 
  h4= html.offsetHeight; 
  h5= html.clientHeight;
  
  console.log("bscrH :"+ h1 + ", boffH :"+h2+ ", HtmlscrH:"+h3+", HtmloffH:"+h4+", HtmlcliH:"+h5);
</script>

However, when I hide some elements  inside the page with javascript, none of them changed ! How can I get the instant height of my page after hiding an element ? thanks.

[cyberRobot]

One option would be to write a function that gathers the necessary height information. Then run the function to initialize your height variable(s). If something is hidden after the initialization, run the function again to update the variable(s).

You could also check to see if there's an event listener built into JavaScript for detecting changes to the page height. If something like that is available, you could have that run the necessary code to update the height information.

For example, the "resize" event listener might be useful when gather height information when the user changes their browser's window size. More information can be found here:
https://developer.mozilla.org/en-US/docs/Web/API/Window/resize_event

Additional listeners may be available for other events that impact page height.

[maxxd]

What's the issue you're trying to solve? I'm extrapolating (perhaps quite heavily, tbh) but given your variable names I wonder if what you're trying to achieve would be better suited to CSS than JS.

[eaglehopes]

Thanks maxxd, I am trying to look for alternative solutions for hiding a top down menu while scrolling down in my web page http://enginery.freecluster.eu 

Although my current code solves my problem in big screens, for tablets and smartphones my page could not seem correct since height condition to hide menu remains too low. So I wanted to direct to alternative solutions.