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

您必须在窗口滚动事件上更新floating_menu元素的样式属性。

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

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

1 个答案: