Question

Hey all i have a JSFiddle that i have been working on with trying to get it to animate going from bottom to top instead of what its currently doing, top to bottom.

This will be used as a animated bar graph for a fund raiser amount that’s in front of an image and this bar graph will represent the amount in dollars they have raised so far.

The jsfiddle is here: http://jsfiddle.net/kboucher/YDruG/

Any help would be great!!!

update

The HTML code:

<a href="#" id="button">View 100 (out of 500)</a>

<div id="barGraph-container">
    <div id='barGraph'></div>
</div>​

The JS:

$('#button').click(function(){
    $('#barGraph').animate({height:'72px'}, 500);
});

​
The CSS:

#barGraph-container {
    height: 200px;
    position: relative;
}
#barGraph {
    height: 200px;
    width: 50px;
    background-color: #000;
    position: absolute;
    bottom: 0;
}​

Answer 1

Try putting a container around your bar graph and use absolute positioning to anchor it to the bottom of the container.

Like this: http://jsfiddle.net/kboucher/YDruG/