How can I create a dynamic animated bar graph using jQuery? I am looking to make the bar slide up from the bottom, incorporating images for both the bar and background. I have already set the positioning in CSS and now need to add animation to make the bar appear. Once the bar is displayed, I also want to show a pop-up image. The animation is functional, but my goal is to have the bar sliding up from the bottom.
$(document).ready(function() {
$(window).load(function(){
$("#graph_bar").animate({
"height":"toggle"
},2000,function(){
$("pop").show();
});
});
}); #graph_bg{
position:relative;
}
#graph_bar{
position: absolute;
top:270px;
left: 182px;
display: none;
}
#pop{
position: absolute;
top:50px;
left: 50px;
display: none;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img id="graph_bg" alt="graph_bg" src="graph_bg.jpg"/>
<img id="graph_bar" alt="graph_bar" src="graph_bar.jpg"/>
<img id="pop" alt="pop" src="image.jpg"/>