Another step in making my large slider

Another step in making my large slider

Ok, I posted before and got some good direction to move in but again I am stuck.

I have an image slider that is made up of images from the wordpress gallery function (i am SOO much better at PHP than javascript). I  have the output of the gallery to be like this:
  1. <div>
  2. <ul>
  3. <li>image</li>
  4. <li>image</li>
  5. <li>image</li>
  6. <li>image</li>
  7. </ul>
  8. </div>
The div is supposed to work as a window where the overflow is hidden but I have it set to be 100% of the browser width. The goal is to slide through the images where the "next" image is centered on my screen.

I am using the jquery serialScroll and scrollTo (which is for the most part, AWESOME) but I am having some issues with getting it to calculate the distance so that no matter what the size of the image (portrait or landscape) it always lands in the center;

Here is my test page:
http://bscdeveloper.com/photo/#

Here is the website that I am emulating
http://www.justinhackworth.com/#imagegalleries/Weddings/Weddings/29