用Javascript更新（style.top）浮动菜单的位置

Question

我正在使用JavaScript进行浮动菜单设置，假设用户向下滚动或调整窗口大小时，该菜单将保持不变。

到目前为止，它在X位置工作正常。 但是，我找不到使它固定在相对于窗口顶部可见的位置的方法。 问题是当我向下滚动菜单时消失，因为它保持与窗口大小有关的距离。

我的代码是：

    menuPosition : function (){
        var windowHeight = document.body.clientHeight;
        var windowWidth = document.body.clientWidth;
        var xPosFloatingMenu = (windowWidth) - (fMenuWidthGlobal + fMenuXPosGlobal);
        var yPosFloatingMenu = (windowHeight) - (windowHeight - fMenuYPosGlobal);
        document.getElementById("floating_menu").style.left = (xPosFloatingMenu) + "px";
        document.getElementById("floating_menu").style.top = (yPosFloatingMenu) + "px";


    },

    updateMenuPosition : function () {
        var menuPositionInterval = setInterval(gala.create.menuPosition,1);
    } 

有没有办法使菜单位置相对于窗口的可见顶部保持更新？

Answer 1

您必须在窗口滚动Event上更新float_menu元素的样式属性。

https://developer.mozilla.org/en-US/docs/Web/API/window.onscroll