_monthly_posts.html.erb

<ul id="blog_months">
	<% @months.each_with_index do |month, index| %>
		<li class="<%= monthly_post_list_class(month) %>">
			<div class="outer_month_border">
				<div class="monthly_posts <%= cycle("light_outer", "dark_outer")%>">
				<div class="monthly_posts_inner_bar <%= cycle("light_inner", "dark_inner")%>" style="height: <%= month_percentage_calculator(index) %>%"></div>
				</div>
			</div>
			<%= content_tag :h5, link_to(month, articles_path(:month => (index+1))), :class => todays_month(index) %>
		</li>
	<% end %>
</ul>

application.js

// Site wide javascript file
$(function(){
	$('body').removeClass('js-disabled').addClass('js-enabled');
	
	$('.monthly_posts').slidingMonthBars();
});

$.fn.slidingMonthBars = function() {
	return this.each(function(){
		$(this).hide().show("slide", { direction: "down" }, 1000);
	});
}