JQuery :: To Change Height Of Sprite Image

I am trying to do something with a sprite image, which is changing the height of it when an action button is clicked. The sprite image is 602x5485px. For clarity here's the link [url] and here's the image [url] and when the "Run sequence" button is clicked the height of the background image is supposed to change (each image is 602x399) so I need to add another 399px to move to the next one. The sequence will run till the last picture and then come back so that it gives a kind of movie animation (so in brief adding 399px till it reaches the last pic and then removing 399px till it gets to the first one).

Here's the html page without the script:

HTML Code:

And here's the css just for the sprite image:

Code:

Ok let's get to the script now (which won't be an external file but within the html page, I separated it temporarily for the sake of clarity). What the script should do, I think, is to get the background image which is in the css, and change the css background position adding - as said - 399px. When it gets to the end, remove 399px till it gets to the first image.

So in practice here are my last (believe me of many!) attempt:

Code:

I am not sure whether this is correct but I am not quite sure how to continue. The thing is, I want to change the height of the background image as said and the above should change at least one image but it doesnt work. If somebody has the patience to talk me through that (I am a beginner so I would like to attempt to build the code myself.