Search code examples
jqueryonmouseout

Getting popup to close on mouseout in asp.net/jquery


I have a pop up that appears on my page when I mouse over a link. The popup is not just some text or an image, it is its own web page. The popup appears without any problems onmouseover, but I can't seem to get it to disappear onmouseout. I know that I need to write some kind of javascript code to hide the popup onmouseout, but I can't seem to get it to work. Does anyone have any suggestions? Here is my code:

<a class="hoverlink" href="#" onmouseover="javascript:openPopup('TCW_BannerIPGChart.aspx?IPG_desc=<%# Eval("IPG_desc") %>&banner=Cub Foods&enterprise_zone=1')" onmouseout="javascript:closePopup()"><%# Eval("IPG_desc")%></A>

The error when I mouse out on the page says closePopup is undefined, which makes sense because I haven't been able to correctly define it in JQuery so if anyone knows how I'd really appreciate it. As a side note, I don't need to define openPopup any more than I have in the above asp.net code. I'm not sure why it doesn't need any extra code.


Solution

  • maybe you should use hover. I don't know how your code looks, but this is a simple jQuery way of doing this

    http://jsfiddle.net/pixelass/8y7RP/

    $('.hoverlink').hover(function(){
        $('#popup').toggle();
    })
    

    ---UPDATE--- 2 more fiddles...

    http://jsfiddle.net/pixelass/8y7RP/6/

    http://jsfiddle.net/pixelass/8y7RP/5/