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/

在Jquery中停止动画的最后一帧

1 个答案: