jQuery(function($){
    // set the correct visible|hidden class on toggle items
    $("a.BioPage, #bio-gallery .bio a").hover(
        function() {
            var arbitrary_vertical_offset = -27;
            var arbitrary_horizontal_offset = -20;
            // hide any existing popups
            $('.popup').hide();
            link = $(this).attr('href');
            var bio = $('#bio-gallery .bio a[href=' + link + ']');
            var w = $(window);
            var viewport_height = w.height();
            var viewport_vertical_scroll = w.scrollTop();
            var bio_img = bio.find('img');
            var bio_pos = bio_img.position();
            var bio_offset = bio_img.offset();
            bio_img.addClass('border');
            var popup = bio.next('.popup');
            var new_top, new_left;
            var popup_height = popup.height();
            var vertical_overflow = bio_offset.top + popup_height - viewport_height - viewport_vertical_scroll;
            if ( vertical_overflow > 0 )
                new_top = bio_pos.top - vertical_overflow + arbitrary_vertical_offset;
            else
                new_top = bio_pos.top - 2;
            if ( bio_pos.left > bio.width() * 3 )
                new_left = bio_pos.left - popup.width() + arbitrary_horizontal_offset;
            else
                new_left = bio_pos.left + bio.width();
            var attributes = {
                top: new_top + 'px',
                left: new_left + 'px'
            };
            popup.css(attributes);
            popup.fadeIn('fast', function(){
                popup.fadeTo('fast', 0.9);
            });
        },
        function() {
            link = $(this).attr('href');
            bio = $('#bio-gallery .bio a[href=' + link + ']');
            bio.find('img').removeClass('border');
            bio.next('.popup').fadeOut('fast');
        }
    );

});