CODEWITHSUNDEEP
javascriptjquery
Resitive
Resitive

Reputation: 370

Assign 100% height to a div with jQuery

I have a similar problem like This

I want to animate a div, to a css property of 100% height. This doesnt seem to work:

$("#somediv").css('height', '100%');

Is there a way to solve this other than slidedown/up?

Upvotes: 1

Views: 116

Answers (3)

Patrick
Patrick

Reputation: 684

You can use the parent height like this:

$("#somediv").css('height', $("#somediv").parent().height());

Or put an id on the div you can get the height

$("#divtogethigger").css('height', $("#iddivheight").parent().height());

if you want to animate it:

$('#somediv').animate({
    height: $(this).parent().height()
  }, 5000, function() { 
    // Animation complete.
  });

Upvotes: 1

Pete
Pete

Reputation: 58432

var somediv = $("#somediv");
somediv.css('height', somediv.parent().height());

Upvotes: 1

Naftali
Naftali

Reputation: 146310

Just set the div to be the window's height

$("#somediv").height($(window).height());

If you do not do this, you need all of the parent elements to have an explicit height set in order to use height: 100%;

Upvotes: 2

Related Questions