Vertically Center jQuery Accordion

Question

I used this script to create a jQuery accordion. Check out the working jsFiddle here .

It works great, except I would like the accordion to be vertically centered on the page. The idea is that as the height of the accordion changes the DIV would be constantly realigned to be vertically centered. The accordion would appear to expand from the center of the page, rather then sliding down from the top.

Answer 1

You can write a method which will center the accordion container and call this method whenever sliding animation is complete as per your logic.

function centerIt(){
    var $accordion = $('.accordion');
    $accordion.css('top', ($(window).height() - $accordion.height())/2);
}

Working demo - http://jsfiddle.net/hDRMP/6/