/*
 * jQuery.centerOf(center_of)
 * 
 * This will center an element within the window or another element.
 * 
 * The 'center_of' can be:
 * - window (default)
 * - parent (which it will be relative to)
 * - jquery selector (centered element does not need to be a descendant)
 * 
 * The position will be updated on window resize.
 * 
 * Tested in:
 * Firefox 2+
 * Chrome 0.4x
 * Safari 3.x
 * IE7
 * Opera 9.5x
 */
(function($) {
   $.fn.centerOf = function(center_of){
        center_of = center_of || 'window';
        var el = $(this);
        el.css('position','absolute');
        $(window).resize(
            function(){
                var top, left;
                if(center_of == 'window'){
                    var h = $.browser.opera && $.browser.version > "9.5" &&
                             $.fn.jquery <= "1.2.6" ?
                                document.documentElement["clientHeight"] :
                                $(window).height();
                    top = $(window).scrollTop()+(h-el.outerHeight())/2;
                    left = ($(window).width()-el.outerWidth())/2;
                } else if(center_of == 'parent'){
                    var parent = el.parent();
                    if(parent.css('position') == 'static'){
                        parent.css('position','relative');
                    }
                    top = (parent.outerHeight()-el.outerHeight())/2;
                    left = (parent.outerWidth()-el.outerWidth())/2;
                } else {
                    var center_in = $(center_of);
                    var offset = center_in.offset();
                    top = offset.top + ((center_in.outerHeight()-el.outerHeight())/2);
                    left = offset.left + ((center_in.outerWidth()-el.outerWidth())/2);
                }
                el.css({'top': top+'px','left' : left+'px'});
            });
        // Fire window resize to initialise position
        $(window).resize();
        return el;
   } 
})(jQuery);