[jQuery] hover event going to infinite loop

[Sridhar]

Hi,

   I am trying to use hover event in jquery to accomplish the
following.

I have a image button. when the user hovers over the image, it should
display a div with the details. when the user moves the mouse off of
the image and the content, the content should go away. Also, if the
user clicks on the image button, the content should stay until the
user clicks the image button. This is what I have so far but it is not
working properly. when I hover over the image and go to the content
and hover off the image and again hover to go to the content, it is
going to infinite loop. Please let me know if you have any ideas.

-- jquery
jQuery(function($) {
            var clicked = false;
            $('#divEmpDetails').hover(
                function(event) {
                    $('#EmpDetails').slideDown
('normal');
                },
                function(event) {
                    if (!clicked) {
                        $('#EmpDetails').slideUp('normal');
                    }
                }
                );
            $('#divEmpDetails').toggle(
                function() {
                    clicked = true;
                    $('#EmpDetails').slideDown
('normal');
                },
                function() {
                    clicked = false;
                    $('#EmpDetails').slideUp
('normal');
                }
                );
        });

-- html

<div id="divEmpDetails">
        <div>
            <asp:Image ID="ImageButton1" runat="server" ImageUrl="~/
_assets/img/desc.gif" />
        </div>
        <div style="display:none" id="EmpDetails">
            <table border="1" cellpadding="0" cellspacing="0">
            <tr>
                <td>First Name</td>
                <td>Howard</td>
            </tr>
            <tr>
                <td>Last Name</td>
                <td>Chase</td>
            </tr>
            <tr>
                <td>Address</td>
                <td>My Address</td>
            </tr>
        </table>
        </div>
    </div>