창이 90% 미만으로 줄어들면 jQuery 상단 스크롤 막대가 작동하지 않습니다.

Question

저는 ASP.NET VB를 사용하고 있으며 기본 하단 스크롤 막대를 시뮬레이션하는 상단 스크롤 막대를 구현했습니다. 무슨 이유에서인지... 창 크기를 조정할 때 크기가 90% 미만이 되면 상단 스크롤 막대가 작동을 멈춥니다... 크기가 90% 이상으로 돌아가자마자 계속 작동합니다... 해결책이나 도움을 찾을 수 없습니다...

너비를 여전히 작동하는 너비의 90%로 제한하려고 했지만 작동하지 않았습니다... 90% 미만의 크기 조정 작업이 문제의 유일한 원인인 것 같습니다... 너비 자체가 아닙니다. .. 하지만 제가 틀릴 수도 있어요...

코드는 다음과 같습니다:

<script type="text/javascript" src="/Scripts/jquery-3.6.0.min.js"></script>
<script type="text/javascript">
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(function () {
        TopScrollBar();
    });

    $(document).ready(function () {
        TopScrollBar();
    });

    $(window).resize(function () {
        TopScrollBar();
    });

    function TopScrollBar() {
        // 将divWidth的宽度设置为GridView1的宽度
        $('#divWidth').width($('#GridView1').width());

        // 将divScroll的滚动与GridContainer同步
        $("#divScroll").on('scroll', function () {
            $("#GridContainer").scrollLeft($(this).scrollLeft());
        });

        // 将GridContainer的滚动与divScroll同步
        $("#GridContainer").on('scroll', function () {
            $("#divScroll").scrollLeft($(this).scrollLeft());
        });
    }
</script>
<div id="divScroll" style="overflow-x: scroll; overflow-y: hidden; height: 20px;"
    <div id="divWidth"></div>
</div>
<div id="GridContainer" style="overflow-x: scroll;">
    <asp:GridView ID="GridView1" runat="server" CssClass="gridviewStyle" ClientIDMode="Static">
    </asp:GridView>
</div>


CSS:
.gridviewStyle {
    width: 100%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
}

Answer 1

이것이 유일한 문제인지는 모르겠지만 일반적으로 on을 사용하기 전에 off를 사용해야 합니다.

새 이벤트 리스너를 추가하지만 이전 이벤트 리스너는 제거하지 않습니다.

이것을 시도해 보세요:

으아아아