CODEWITHSUNDEEP
jqueryhtmlheight
Doug Molineux
Doug Molineux

Reputation: 12431

JQuery Height of Div to increase in size Vertically

I am trying to get a div to increase in height but moving upwards instead of downwards, this happens almost every second (on a realtime event):

 height++;
 $("#bar").height(height);

But right now the top of the box stays in the same position while the bottom of the bar goes down. I want the bottom of the bar to stay where it is while the top moves up with each event. I hope this makes sense, any advice would help thank you!

UPDATE: The CSS of the bar:

#bar
{
 width:20px;
 height:0px;
 display: block;
 background-color: blue;
}

Upvotes: 0

Views: 2997

Answers (2)

kobe
kobe

Reputation: 15835

Pete ,

Make it position absolute and give the bottom some pixel, so it always stays there

#bar
{
 width:20px;
 display: block;
 background-color: blue;
 position:absolute;
 bottom:2px;

}

make this parent div relative

Upvotes: 1

Robert
Robert

Reputation: 21388

The div will animate bottom to top unless you attach it by the bottom css style. For example

http://jsfiddle.net/robert/BWwyf/

div {
    position: absolute;
    bottom: 0;
}

then

$('div').slideUp();

This will animate from the top to the bottom

Upvotes: 1

Related Questions