Question

当用户点击任何公寓时，我会出现一个对话框。您可以在此处查看其工作原理：CLICK HERE

如果视口高度大于550px，我想要锁定滚动条。现在我将overflow:hidden应用于body，但这会导致站点在滚动条隐藏时跳转。我想禁用滚动，但仍显示滚动条。有可能吗？

提前致谢！

Answer 1

您可以通过检测滚动来模拟滚动条锁定，然后滚动回到上一个位置..（在某些浏览器上可能会显得不稳定，特别是如果您拖动滚动条本身）

function lockScroll() {
    var lockX = window.scrollX;
    var lockY = window.scrollY;

    function lockIt() {
        window.scrollTo(lockX,lockY);
        return false;
    }

    window.addEventListener("scroll",lockIt,false)

    return {
        stop: function(){
            window.removeEventListener("scroll",lockIt,false)
        }
    }
}

用法：

var locker = lockScroll(); // locks scrolling

当你完成后，你可以重新启用滚动

locker.stop();  // unlocks scrolling

如何锁定滚动条并使其可见

1 个答案: