reworking jcarousel animation

Question

Hi folks. I am pulling serious amounts of hair out over this. The problem: make jcarousel accept variable width image and center them with no gaps between images. Mathematically, my solution is correct although hacky, and the result is a slight hitch before each slide animates. A slight, very madding hitch. Please take a look at http://jontakiff.com/brookssite2010/wood-portfolio-test.php, the hitch is totally noticeable...the slide moves back just a bit before moving the right way...

I have made the slideshow work by appropriately changing the left position of all visible elements using the callback function. The basic problem is that the elements are being instructed to move in two directions at once. Rather than setting the left offset for all visible items, it now seems I would need to restructure this to have elements animating to the left or right a certain amount of pixels....I don't know really...I am about to pull my last hairs out...please, kind stack overflow folks, give me a clue....must...remove...hitch...in...slideshow...

Here's the callback function code that makes it ALMOST work correctly:

function mycarousel_itemFirstInCallback(carousel, item) {

    var offset=$('div.jcarousel-clip-horizontal').width()-jQuery(item).width();
    var offsetval=offset/2;

    jQuery(item).css('left',offsetval); 
    jQuery(item).next().css('left',0);  
    jQuery(item).prev().css('left',offsetval);
    jQuery(item).prev().prev().css('left',offsetval);
    jQuery('div.jcarousel-prev-horizontal').css('width',offsetval);//set button width       
    jQuery('div.jcarousel-next-horizontal').css('width',offsetval);//set button width
    jQuery(item).addClass('layering'); //z-index 

};