javascript - stopping an animated object - jQuery & spritely plug in -

i trying set animated div rolls across screen once stops unless page reloaded.

   // javascript document  jquery(document).ready(function() {  $('#far-clouds').pan({     fps: 20,      no_of_frames: 24,      on_first_frame: function(obj) {         obj.spstate(1); // change state 1 (first row) on frame 1     },      on_last_frame: function(obj) {         obj.spstop(); // stop animation on last frame     },     on_frame: { // note - on_frame object not function         19: function(obj) { // called on frame 19             obj.spstate(2); // change state 2 (row 2) on frame 19         },         16: function(obj) { // called on frame 16             obj.spstate(3); // change state 3 (row 3) on frame 16         }     } });    $('#near-clouds').pan({     fps: 20,      no_of_frames: 24,      on_first_frame: function(obj) {         obj.spstate(1); // change state 1 (first row) on frame 1     },      on_last_frame: function(obj) {         obj.spstop(); // stop animation on last frame     },     on_frame: { // note - on_frame object not function         19: function(obj) { // called on frame 19             obj.spstate(2); // change state 2 (row 2) on frame 19         },         16: function(obj) { // called on frame 16             obj.spstate(3); // change state 3 (row 3) on frame 16         }     } });    }); 

jsfiddle: http://jsfiddle.net/pzbmb/2/

the plug in i'm using spritely - documentation version states can setup obj.stop using reference frame animation should stop. obj #far-cloud. .pan (panning) across screen animation function handled plug in script. calling on function stop on 19th frame. not working. continues loop. can't seem find reason this. other using regular jquery callback stop it. i'm sure else can do.

so assistance great. thanks!