jquery悬停的div中的输入表单，当鼠标悬停在输入框上时，导致div关闭

完全不了解jquery，所以如果这里使用了不正确的术语，请原谅。 正如在JSFIDLE失败的尝试中所看到的，我使用jquery将一个登录表单嵌入到悬停状态动画中。但是，如果我用鼠标在下拉菜单中选择任何项目，则会释放悬停状态并关闭div。我做错了什么？除了输入的悬停问题外，我还需要向脚本添加什么，以便在将鼠标移到div上时，选项卡文本保持悬停状态的颜色和背景

---

在Safari中看起来不错：-）在Chrome中看起来也不错：-）问题发生在Firefox中。我可能会建议，这种规模的基于悬停的动画通常不会带来良好的用户体验。我看不到开始表单标签。在Chrome中，如果您从黄色框下方的下拉列表中选择一个条目，它将关闭。此外，如果将鼠标悬停在远离下拉列表的位置，该框也会关闭。

jQuery(function ($) {
    $('#footerSlideContainer').hover(function () {
        $('#footerSlideContent').animate({
            height: '250px'
        });
        $(this).css('backgroundPosition', 'top left');
    },

    function () {
        $('#footerSlideContent').animate({
            height: '0px'
        });
        $(this).css('backgroundPosition', 'top left');
    });
});