jQuery animate undefining another function?

Question

I have a function that takes thumbnails and displays a larger version of them inside a div when clicked. Some of these photos have a 16:9 aspect ratio while others have a 3:2. To compensate a wrote a function that adds padding to the top of the widescreen photos in order to have a letterbox feel inside the div they are loaded in. This works fine when I use the .css method to render the padding, but when I try to use .animate to give it a little style, the function that controls the gallery returns as undefined.

This is the gallery function that goes undefined when I use .animate:

function gallery(picid, picnum){
 var ext = 'jpg';
 var fullSize = 'imgs/photos/'+picid+'_large.'+ext;
 $('#largeimg').attr("src", fullSize);
 $('#lightboxlink').attr({ 
 href: fullSize , 
 rel: 'lightbox' ,
 title: imgdesc[picid]['caption']});

 $("#lightboxlink").live('click', function(e){
   $(this).filter(':not(.fb)').lightBox({
   containerResizeSpeed: 900,
   imageLoading: 'imgs/lightbox-ico-loading.gif',
   imageBtnPrev: 'imgs/lightbox-btn-prev.gif',
   imageBtnNext: 'imgs/ligtbox-btn-next.gif',
   fixedNavigation: true, 
    txtOf : 'This is a caption'
 }).addClass('fb');
 $(this).triggerHandler('click');
 e.preventDefault();
});

 return false;
}

And here is the script which adds the padding if the image is widescreen.

$(document).ready(function(){
$("#photorow1 a").click(function(){
 if($(this).hasClass('wide')){
  $('#largeimg').css('padding-top' , '5%');
 }
 else{
   $('#largeimg').css('padding-top' , '0');
  }
});
 });

Here is the HTML I'm attempting to animate

<div id="photolarge">
   <a id="lightboxlink" href="#"><img id="largeimg" /></a>
</div>
        <div id="phototable">
            <ul id="photorow1">
                <li><a class="wide" onclick="gallery('bigsun',1)"><img id="sun" src="imgs/bigsun.jpg" /></a></li>
            </ul>
        </div>  

Edited for script mistake.

Any help would be greatly appreciated!!