Hello, I'm afraid I really don't know anything about JavaScript or JQuery, but suddenly I have a need to learn.

I am working on this website http://www.cranihum.com/ if you scroll down to the footer you will see a pigeon. This pigeon was filmed on a green screen and the background keyed out. On the website it is a single strip png comprising 93 frames each 80 px wide total 7440px wide. I've used a plugin from www.spritely.net to animate the pigeon.

I want to have a longer strip to play a longer video but I am limited by PhotoShop which won't save a png wider than 8192px.

So I want to use rows, when it gets to the end of the row it should move down one row and play the next line. This would allow me to create much longer video clips of the pigeon.

How do I write a script to do this?

In trying to copy and paste bits from the plugin's .js files I've come up with this but it doesn't work:

[CODE] if (['current_frame'] > 93) {
$('#bird2').spState(2);
} else {
$('#bird2').spState(1);
}
[CODE]

spState(2) means play the second row, spState(1) means play the first row.

After the 93rd frame I want the second row of #bird2 to play.

Really stupid question but I don't even understand what the [ brackets mean?!

Perhaps a good site to help me get into JavaScript would be the best start.

Thank you

Will