Advanced jQuery .animation problem -- animates from wrong side

I'm working on creating a jQuery book online that utilizes .animate to create nifty effects. I'm nearly finished with the initial animation and design, but have run across a pretty irritating snag.

Have a look at http://notebook.dauidusdesign.com to see the problem.

The trouble: When you click on the right arrow or hover to see the next page, all works exactly right. But, when you hover on the left arrow, the animation occurs on the wrong side of the page... it should occur on the left side and show the page behind it. I'm pretty sure it comes down to something in the code below, as that is where the majority of hover animations occur.

For a look at the rest of the code, visit the site above, view the source and check out the file jquery.booklet.1.1.0.js. The code below begins at line 401.

Thanks for the help!

//add page hover animations
if(opts.hovers){
    ctrlsN.hover(
        function(){
            if(!busy && opts.curr+2 <= opts.pTotal-2){
                //animate
  p2.stop().animate({right:5, 'width':opts.pWidth-140, 'height':opts.pHeight}, 800, opts.easing);
  p2wrap.stop().animate({left:"-5px"}, 800, opts.easing);
  p3.stop().animate({'left':opts.width-180, 'width':30, paddingLeft: 50}, 800, opts.easing);
  p3wrap.stop().animate({left:10}, 800, opts.easing);
  rhover = true;
            }
        },
        function(){
            if(!busy && opts.curr+2 <= opts.pTotal-2){
  p2.stop().animate({right:0, 'width':opts.pWidth, 'heig开发者_Python百科ht':opts.pHeight}, 800, opts.easing);
  p2wrap.stop().animate({left:0}, 800, opts.easing);
  p3.stop().animate({'left':opts.width, 'width':0, paddingLeft: 0}, 800, opts.easing);
  p3wrap.stop().animate({left:0}, 800, opts.easing);                
  rhover = false;
            }
        }
    );
    ctrlsP.hover(
        function(){
            if(!busy && opts.curr-2 >= 0){
                //animate
  p1.stop().animate({left:5, 'width':opts.pWidth-140}, 800, opts.easing);
  p1wrap.stop().animate({right:"-5px", 'right':opts.pWidthH-140}, 800, opts.easing);
  p0.stop().animate({'right':opts.width-180, left:100, 'width':80}, 800, opts.easing);
  p0wrap.stop().animate({right:10}, 800, opts.easing);
  lhover = true;
            }
        },
        function(){
            if(!busy && opts.curr-2 >= 0){
  p1.stop().animate({left:0, 'width':opts.pWidth}, 800, opts.easing);
  p1wrap.stop().animate({right:0, 'right':opts.pWidthH}, 800, opts.easing);
  p0.stop().animate({'right':opts.width-0, left:0, 'width':0}, 800, opts.easing);
  p0wrap.stop().animate({right:0}, 800, opts.easing);
  lhover = false;
            }
        }
    );
}