JQuery :: Change BG Position On Horizontal Webpage

I have been using jquery (which is fantastic) for over a year now, but only basic little bits of code. Now I want to try something a little bigger but I can't get it to work. The problem is, I have a fixed background with position to the left which when scrolling horizontally it sits flush against the left, I want it so when you get to the end of the document it smoothly carries on to the right and then sits flush against the right. And when you scroll back towards the start it bounces back to where it was before. The code I've tried so far which works, but whenever I try 'click' instead of 'hover' nothing works? Also it just jumps to the other side, I'm not sure how to make it scroll to the other side smoothly.

$(document).ready(function(){
$('#Linkintro').hover(function(){
$('#wrapper').css('background-position', newValue);
}, function(){
$('#wrapper').css('background-position', 'right');
});});