停止在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(); 
    }); 
    ​ 

见：http://jsfiddle.net/LeusR/35/