JQUERY hover show/hide div

Question

I have a form that on subit hover i need to display a popup that disappears when the mouse is out of the popup div and the submit button. For now the hover popup is showing but when the mouse enters the popup, it disappears. Can some one help me solve this problem.

For now i have this code:

<form name="email_form" id="hover_form'. $id.'" style="float: left;width: 150px;text-align: center;padding-bottom: 10px;">
    <input id="counter_btn'. $id.'" type="button" value="" style="margin-bottom:10px;float:left;height: 50px;width:50px;background: none;border: none;background-image: url(../images/email_counterbtn.png);background-size: 30px;background-repeat: no-repeat;background-position: center;"/>
    </form>
    <script>
    $(document).ready(function(){  
  $( "#hover_form'. $id.'" )
  .on( "mouseenter", function() {
   $(".btnpopup'. $id.'").fadeIn("fast");
  })
  .on( "mouseleave", function() {
    $(".btnpopup'. $id.'").fadeOut("fast");
  });   

  });
    </script>
    <div id="button-popup" class="btnpopup'. $id.'">
    <div style="width: 0px;height: 0px;border-style: solid;border-width: 10px 20px 10px 0;border-color: transparent #009dde transparent transparent;line-height: 0px;_border-color: #000000 #009dde  #000000 #000000;margin-left: -25px;margin-bottom: -40px;position: absolute;bottom: 65px;"></div>
            <p id="_email'. $id.'" style="border-bottom:1px solid white;cursor:pointer;">Email</p>
            <p id="_calendar'. $id.'" style="cursor:pointer;">Calendar</p>
            <script>
            $(document).ready(function(){
        $("#_email'. $id.'").click(function () {
           $("#counter'. $id.'").show("fast");
        });
        $("#_calendar'. $id.'").click(function () {
           $(".timepopup'. $id.'").show("fast");
        });
    });

Answer 1

Your popup is not part of the form. So when the mouse enters the popup it leaves the form. Define the popup inside the form-tag and it should work.

Something like this:

<form id="hover_form'. $id.'">
   <div id="button-popup"></div>
</form>