Question

我尝试做的是让它在移动菜单打开时不再可滚动身体，但页面上的位置会被保存，以便在身体的位置再次固定和不固定，用户不会失去他们在页面上的位置。

当我在Chrome开发工具的iphone模拟器中尝试使用时，下面的效果非常好，但它在我的实际iphone SE上无法正常工作（在Chrome和Safari上）。有没有人知道为什么会这样？

＆＃13;

function storeBodyScroll() {
    var scrollpos = $('html').scrollTop();
    $('body').css({top: -scrollpos});
}

function closeMenu() {
    // See if the body's scroll position is being held
    var scrollpos = parseInt($('body').css('top'), 10);

    $('body').removeClass('mobile-menu-open');

    // Scroll to it if it is and remove held position
    if (!!scrollpos && scrollpos < 0) {
        $('html').scrollTop(-scrollpos);
        $('body').css({top:0});
    }
}

function openMenu() {
    storeBodyScroll();
    $('body').addClass('mobile-menu-open');
}

＆＃13;

body.mobile-menu-open {
    position: fixed;
    overflow-y: scroll;
}

＆＃13;

Answer 1

按照我在iPhone上的预期方式实现这项工作实际上最终只是一个简单的修复：似乎$（'html'）。scrollTop（）不会返回我期望的值。

相反，我将$（'html'）。scrollTop（）替换为$（window）.scrollTop（），并用window.scrollTo（0，scrollpos）替换$（'html'）。scrollTop（-scrollpos）

使用位置时保存滚动位置：固定以防止iphone上的正文滚动

1 个答案: