[jQuery] animate & fade stop() problem

[Denis Abramov]

Hello over there! The problem is:

when I start hovering in and out very fast, the new div block appears
before previous one dissapears.

How to get rid of that effect?

I heard that there is stop() event, how to implement it in the current
situation? I tried to put it before animate, but that doesn't give any
effect.


                        $(function() {



                                var offsetY = 10;
                                var offsetX = 20;

                                $('#logolnk').hover(
                                        function(event)
                                        {
                                                $("<div
id='tooltip'>Sorry this website is under construction</div>")
                                                .css("opacity", .7)
                                                .fadeIn(500)
                                                .appendTo('body')
                                                .css("top",
event.pageY + offsetY)
                                                .css("left",
event.pageX + offsetX);



                                        },
                                        function()
                                        {
                                                $("#tooltip").stop
().animate({"opacity": 0},500, function(){
                                                        $(this).remove
();
                                                });
                                        }

                                );


                                $("#logolnk").mousemove(function
(event) {
                                                $("#tooltip")
                                                .css("top",
event.pageY + offsetY)
                                                .css("left",
event.pageX + offsetX)
                                });
                        });


http://i192.photobucket.com/albums/z228/Somebi/problem.jpg