Jqueryのアニメーションの最後のフレームで停止する

Question

http://spritely.net/というプラグインを使用して、Jqueryでアニメーション化されたスプライトを作成しています。

私はそれがマウスの上に開始し、スプライトの最後のフレーム '8'にマウスがオフになるまでそれが必要であることを除いて、正常に動作します。ここで

は、コードは次のとおりです。

<script type="text/javascript"> 

    (function($) { 
     $(document).ready(function() { 


          $('#bird') 
           .sprite({ 
            fps: 16, 
            no_of_frames: 8, 
            // the following are optional: new in version 0.6... 
            start_at_frame: 1, 
            on_first_frame: function(obj) { 
             if (window.console) { 
              console.log('first frame'); 
             } 
            }, 
            on_last_frame: function(obj) { 
             // you could stop the sprite here with, e.g. 
             // obj.spStop(); 
             obj.spStop(); 
            }, 
            on_frame: { 
             8: function(obj) { 
              // you could change the 'state' of the 
              // sprite here with, e.g. obj.spState(2); 
              if (window.console) { 
               console.log('frame 8'); 

              } 
             } 
            } 
           }) 








     }); 
    })(jQuery); 

</script> 

すべてのヘルプは素晴らしいことです。

ありがとうございました

Answer 1

これは役に立ちます。

var mouseMoved = false; 
    $('#wrapper').hover(
     function() { 
      $('#stage1').stop(true, true).fadeIn(1000,function() { 
       mouseMoved = false; 
       console.log(mouseMoved) 
       $('#stage2').fadeIn(1000,function() {console.log(mouseMoved) 
        $('#stage3').fadeIn(1000,function() {console.log(mouseMoved) 
         if (mouseMoved == true) { 
          $('#wrapper div').delay(50).fadeOut(); 
         } 
        }); 
       }); 
      }); 
     }, 
     function() { 

     } 
    ); 
    $(document).mousemove(function (event) { 
     mouseMoved = true; 
     $('#wrapper div').fadeOut(); 
    }); 
    ​ 

を参照してください：あなたはので、私はそれで遊ぶことができますjsfiddle.netのデモを作成することができればhttp://jsfiddle.net/LeusR/35/