All geek questions in one place

Can we change html or body height using jquery?

I am trying to run this statement: $('body').height(100); but when I check the height again, I find it unchanged!

Is there a way to change the height of the <body> ?

+4
source share
4 answers

The body of the document is a magic element and does not behave the way other HTML elements do. Your code:

 $('body').height(100);

That's right, and it is the same as:

 $('body').css({height: 100}); $('body').css({height: '100px'}); $('body').attr({style: 'height: 100px'});

All results:

 <body style="height: 100px;">

However, setting the height will not hide the area located outside the 100px height, invisible. You should wrap the contents of the body inside the div and set it instead:

 <body> <div id="wrapper" style="height: 100px; overflow: hidden;"> <!-- content --> </div> </body>

A jQuery solution would be:

 $("body").wrapInner($('<div id="height-helper"/>').css({ height: 100, overflow: "hidden" }));
+6
source

You should actually use

$('body').css('height', '100'); and it will work.

+3
source

Try using $('body').addClass('your class name'); or $('body').attr('style', 'height: 100px');

0
source

It should be

 $('body').css('height', '100px');

or

 $('body').height(100);
0
source

Source: https://habr.com/ru/post/1397986/

More articles:


All Articles