Question

I’m animating a vertical bar using jquery, but it goes from top to bottom, wheres I need it from bottom to top.

This is the css of the bar:

.progress_bar_cal{
height:0px;
width:24px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
background:url(../img/grow.jpg);
margin-right:1px;
margin-top:2px;
}

And this is the jquery:

$('.progress_bar_cal').each(function(){
    var percent = $(this).attr('title');
    $(this).animate({height : percent},1000);   
}); 

Any idea’s on how to make it work?

Thanks!

Answer 1

if .progress_bar_cal is in position: absolute with bottom : 0 inside an element with position: relative you should see the bar expand from bottom to top