jQurery中的stop()使用中出现的背景塌陷消失解决办法（jQuery 的 slideUp 和 slideDown 下拉卷动问题）

我最近在做项目的时候遇到了一个小问题，如图所示：

这是一个鼠标放上去的一个hover的一个slideDown动画，问题就是如果在学校概况和申请上面来回切换进行鼠标的移动的话就会出现下拉框背景塌陷的一个情况，如图所示：


可以发现非学位项目这块消失了，也就是出现了背景高度不断塌陷的一个bug
问题bug代码；

$('.dropdown').hover(function(){ 
        $(this).children(".dropdown-menu").stop().slideDown(300);
    },function(){
        $(this).children(".dropdown-menu").stop().slideUp(300);
    });

之后我修改了stop()里面属性的内容修改过来了
stop()：表示让运动的元素立即停止动画。
接收两个参数，都是布尔值，默认值都是false
第一个参数：是否清空当前动画队列。
第二个参数：是否立即完成当前动画。
①stop(false，false)等价方式stop()表示立即进入下一个动画，立即停止当前动画。
②stop(false，true)表示立即进入下一个动画，立即停止并完成当前动画。
③stop(true，true)表示清空当前动画队列，立即停止并完成当前动画。
④stop(true，false)等价方式stop(true)表示清空当前动画队列，立即停止当前动画。

修改之后的代码如下：

$('.dropdown').hover(function(){ 
        $(this).children(".dropdown-menu").stop(true,true).slideDown(300);
    },function(){
        $(this).children(".dropdown-menu").stop(true,true).slideUp(300);
    });

这样一个小bug就修改过来了，但是效果上不是那么的好，因为是立刻完成当前的动画

同样还有一个办法就是通过setTimeout延时来实现

直接上代码：

// 线程 IDs
    var mouseover_tid = [];
    var mouseout_tid = [];
    
jQuery(document).ready(function(){
        jQuery(".dropdown").each(function(index){
            jQuery(this).hover(

                    // 鼠标进入
                    function(){
                        var _self = this;
                        // 停止卷起事件
                        clearTimeout(mouseout_tid[index]);
                        // 当鼠标进入超过 0.2 秒, 展开菜单, 并记录到线程 ID 中
                        mouseover_tid[index] = setTimeout(function() {
                            $(this).find("li").addClass("current");
                            jQuery(_self).find('.dropdown-menu').slideDown(300);
                        }, 201);
                    },

                    // 鼠标离开
                    function(){
                        var _self = this;
                        // 停止展开事件
                        clearTimeout(mouseover_tid[index]);
                        // 当鼠标离开超过 0.2 秒, 卷起菜单, 并记录到线程 ID 中
                        mouseout_tid[index] = setTimeout(function() {
                                $(this).find("li").removeClass("current");
                                jQuery(_self).find('.dropdown-menu').slideUp(300);
                            }, 201);
                    }

            );
        });
    });

现在问题就可以解决了