Event Listener Not Working With colorbox Plugin

Event Listener Not Working With colorbox Plugin

I am using jQuery Plugin 'colorbox' for a lightbox solution on my site, but when I try to use any event listeners, such as 'cbox_complete' to customize the size of the colorbox to allow for a larger space under the photos for the captions, it doesn't seem to ever fire. Here is the page with the colorbox and below is my event listener. Just click the first image in the content area of the page to start the slideshow. Right now I have the title positioned over the bottom of the photos being loaded in, but with the code below, it should calculate the correct size for the various parts of the colorbox and allow the full photo to be visible. Any help will be appreciated.


<!--colorbox -->
<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="/css/colorbox.css" />
<script src='/scripts/colorbox.js' type="text/javascript"></script>
<script>
$(document).bind('cbox_complete', function(){
    var cboxTitleHeight = $('#cboxTitle').height();
    var cboxContentHeight = $('#cboxContent').height();
    var cboxWrapperHeight = $('#cboxWrapper').height();
    var colorboxHeight = $('#colorbox').height();
var cboxPhotoHeight = $('.cboxPhoto').height();

    $('#cboxMiddleLeft, #cboxMiddleRight, #cboxContent').css('height', (cboxContentHeight + cboxTitleHeight) + 'px');
    $('#cboxWrapper').css('height', (cboxWrapperHeight + cboxTitleHeight) + 'px');
    $('#colorbox').css('height', (colorboxHeight + cboxTitleHeight) + 'px' );
$('#cboxLoadedContent').css('height', (cboxTitleHeight + cboxPhotoHeight) + 'px');
});

</script>