Javascript 悬停LinkButton时滑出/向上面板，无法接触到内容

我试图在悬停链接按钮时使面板向下滑动/SlideUp悬停在链接按钮的正下方。问题是，当我悬停HB按钮3时，它会继续上下滑动，当我试图接触到AccomodationPanel中的内容时，面板会向上滑动，所以我的问题是如何使AccomodationPanel中的内容可以接触到，以便面板未关闭

Jquery：

 $(document).ready(function () {
                    $("#StayOpen").hover(

                    function () {
                        $("#AccomodationPanel").slideDown(1000);
                    }, function () {
                        $("#AccomodationPanel").slideUp(1000);
                    });   
                });

HTML:

 <asp:Panel runat="server" ID="StayOpen" style ="z-index:10;height:auto">
               <asp:LinkButton runat="server" ID="Hbutton3" CssClass="HButton" >

               </asp:LinkButton>

               <asp:Panel runat="server" ID="AccomodationPanel" style ="position:absolute;left:60vw;width:20vw;top:10vh;background-color:#FFD6AD;z-index:11;display:none;height:auto"  >
                   <asp:LinkButton runat="server" ID="StayOpen1" CssClass="StayOpen">ASD</asp:LinkButton>
                   <br />
                     <asp:LinkButton runat="server" ID="StayOpen2" CssClass="StayOpen">ZZZ</asp:LinkButton>
                    <br />
                    <asp:LinkButton runat="server" ID="StayOpen3" CssClass="StayOpen">GGG</asp:LinkButton>
               </asp:Panel>
                   </asp:Panel>

           </asp:Panel>

自闭症


ZZZ


GGG

在jqueryy中使用

.stop（）

您的代码是

$（“#AccomodationPanel”）。停止（true，true）。滑动切换（1000）