Javascript 框正在从搜索栏中分离

所以我在这个页面上工作。
-当有人滚动页面时，输入“临床医生”时出现的框
移动不是绝对的，当我将其更改为绝对时，它仍会继续移动。
-是否有任何css、js或jquery代码将两个类或ID统一在一起， 这样他们就不会离得太远了

因此，我创建的脚本是：

<script>
            $(window).scroll(function () {
                if ($(window).scrollTop() >= 1) {
                    $('.autocomplete-suggestions').each(function(i,j) {
                        $(this).addClass('fix-searcher'+(i+1));
                    });
                }
            });

            $(window).scroll(function () {
                if ($(window).scrollTop() >= 15) {
                    $('.aui .fix-searcher1').addClass("fixed");
                    $('.aui .fix-searcher1').removeClass("fix-searcher1");
                    $('.aui .fix-searcher2').addClass("fixed2");
                    $('.aui .fix-searcher2').removeClass("fix-searcher2");  
                } else {
                    $('.aui .fix-searcher1').removeClass("fixed");
                    $('.aui .fix-searcher1').addClass("fix-searcher1");
                    $('.aui .fix-searcher2').removeClass("fixed2");
                    $('.aui .fix-searcher2').addClass("fix-searcher2");
                }
            });
        </script>

新方法 试试这个。使用CSS定位主体内容，然后简单地将静态类分配给建议div

//这里只需分配一个静态类，我们将不做任何操作
//不再收听窗口滚动，我们将使用
//css重新定位我们的内容。
$（函数（）{
$（'.autocomplete suggestions'）。每个（函数（索引）{
$（this.addClass（'fix-searcher'+（index+1））；
});
});
.au.粘贴顶部+#内容{
页边顶部：自动；
}
/*在浏览器中，60px对我来说工作得很好，你可以随意使用这个数字*/
.au.词缀+#内容{
边缘顶部：60像素；
}
/*不需要其他.fixed和.fixed2类*/
.fix-searcher1{
顶部：140px！重要；
z指数：100！重要；
}
.fix-searcher2{
顶部：490px！重要；
z指数：100！重要；
}
新方法
试试这个。使用CSS定位主体内容，然后简单地将静态类分配给建议div


//这里只需分配一个静态类，我们将不做任何操作
//不再收听窗口滚动，我们将使用
//css重新定位我们的内容。
$（函数（）{
$（'.autocomplete suggestions'）。每个（函数（索引）{
$（this.addClass（'fix-searcher'+（index+1））；
});
});
.au.粘贴顶部+#内容{
页边顶部：自动；
}
/*在浏览器中，60px对我来说工作得很好，你可以随意使用这个数字*/
.au.词缀+#内容{
边缘顶部：60像素；
}
/*不需要其他.fixed和.fixed2类*/
.fix-searcher1{
顶部：140px！重要；
z指数：100！重要；
}
.fix-searcher2{
顶部：490px！重要；
z指数：100！重要；
}
请阅读以下内容：关于
的使用！重要信息
。另外，在一些地方，
之间有一个空格和
重要
。如果您真的想使用所有这些，您应该删除该空间。请阅读以下内容：关于
的使用！重要信息
。另外，在一些地方，
之间有一个空格和
重要
。如果你真的想使用所有这些，你应该删除这个空格。这段代码帮助我修复了一个错误，即框在向上滚动时覆盖了搜索栏，但当你向下滚动时它会一直分离。如何使一个类或ID停止侦听全局滚动事件。当我删除全局滚动事件时，它修复了框。@AlonsoGP编辑的答案中提到的新方法对您有效吗？此代码帮助我修复了一个错误，即框在向上滚动时覆盖了搜索栏，但在向下滚动时它一直分离。如何使一个类或ID停止侦听全局滚动事件。当我删除全局滚动事件时，它修复了框。@AlonsoGP编辑的答案中提到的新方法对您有用吗？
.fixed{
position: fixed ! important;
top:100px ! important;
}

.fixed2{
position: absolute ! important;
top:430px ! important;
z-index:100 ! important;
}

div.dropdown-menu.flyover {
margin-top: -1px !important;
}

div.portlet-borderless-container div.portlet-body div.news-card div.text .category {
z-index: 0;
}

.fix-searcher1{
position: fixed ! important;
top:140px ! important;
}

.fix-searcher2{
top:490px ! important;
z-index:100 ! important;
}

.aui .autocomplete-suggestions {
margin-top: 0 ! important;
}

.sub-menu-affix {
    background-size: 12px 180%,12px 180%,0, 0 ! important;
}