无尽的动画函数,接收'hover'事件的参数



这个想法是在光标位于div上时执行动画。我在其他时候也这样做过,但现在带有动画的函数会收到一个参数,如果我添加参数,页面就会爆炸。如果没有对函数的最后一次调用,代码不会使页面崩溃。请检查我的代码:

function OnHover() {
    function Animation(obj) {
        obj.stop().animate({ top: '20px' }, 600).animate({ top: '0px' }, 600, Animation(obj));
}
    $('#infobox').hover(
        function(event) {
            $circle = $(event.target).children().first();
            Animation($circle);
        }, 
        function(event) {
            $circle = $(event.target).children();
            $circle.stop();
        }
    );
}

我使用了以下解决方法:

$target = undefined;
$("#wrapper .infobox").mouseenter(event, function animate() {
                if (typeof $target == 'undefined')
                    $target = $(event.target).children();
                $target.animate({ marginTop: "+=40px" }, 600);
                $target.animate({ marginTop: "-=40px" }, 600, animate);
            }
        );
        $("#wrapper .infobox").mouseleave(function() {
                $target.stop(true, false).animate({ marginTop: '20px'}, 300);
                $target = undefined;
            }
        );

最新更新