在 body fadeOut 之前存储滚动位置，然后在 body fadeIn 之后 return 滚动位置？

Question

我想为移动菜单创建一个不错的滚动体验，我的想法是 .fadeIn 菜单，并使用 .fadeOut 淡出主站点包装，这样你就可以为移动设备获得更好的弹性滚动，没有故障位置：fixed/body 滚动到甚至在 iOS 10 和 Android.

上仍在发生的业务下方

显然，当包装器为 display:none 时，主体变为视口的高度，将页面跳到顶部，是否可以 return 一旦包装器具有旧滚动位置淡入淡出？

Fiddle 这里：https://jsfiddle.net/y1goy3b2/

任何帮助或问题都会很棒！

干杯

<div class="menu" id="open-menu">
  <div class="menu-bttn">

  </div>
</div>
<div class="mob-menu">

</div>
<div class="site-wrapper">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Prodest, inquit, mihi 
eo esse animo. Non dolere, inquam, istud quam vim habeat postea videro; Et 
ille ridens: Video, inquit, quid agas; Hinc ceteri particulas arripere conati 
suam quisque videro voluit afferre sententiam. Inde sermone vario sex illa 
</p>
</div>
<script>
$('#open-menu').click(function() {
    $('.site-wrapper').fadeToggle('fast');
    $('.mob-menu').fadeToggle('fast');
});
</script>

Answer 1

我已经更新了你的fiddle。请检查 this

    var oldScrollposition = 0;
$('#open-menu').click(function() {

  if($('.site-wrapper').is(":visible")){
    oldScrollposition = $(document).scrollTop();
  }

    $('.site-wrapper').fadeToggle('fast');
    $('.mob-menu').fadeToggle('fast');

  $(document).scrollTop(oldScrollposition);
});

在 body fadeOut 之前存储滚动位置，然后在 body fadeIn 之后 return 滚动位置？

Store scroll position before body fadeOut, then return scroll position after body fadeIn?

html

javascript

css

jquery

user-experience