向下滚动时隐藏菜单，向上滚动时显示，适用于 Chrome，不适用于 Safari（移动设备）答案

【问题标题】：Hide Menu on Scroll Down, Show on Scroll Up, Works in Chrome, Not in Safari (mobile)向下滚动时隐藏菜单，向上滚动时显示，适用于 Chrome，不适用于 Safari（移动设备）
【发布时间】：2015-03-19 18:26:09
【问题描述】：

所以我使用此代码在向下滚动时隐藏我的导航栏，并在用户再次向上滚动时显示它。

它在桌面、所有浏览器上运行良好，它也适用于移动设备 (iPhone) 上的 Chrome，但在 Safari 中，slideUp/slideDown 表现得很疯狂，有时它会显示、隐藏、显示隐藏导航栏几次，然后消失。

就好像事件被多次触发一样。

这是工作代码

   var lastScrollTop = 0, delta = 5;
   $(window).scroll(function(event){
   var st = $(this).scrollTop();

   if(Math.abs(lastScrollTop - st) <= delta)
      return;

   if (st > lastScrollTop){
       // downscroll code
       $("#soulnavbar").slideUp()
   } else {
      // upscroll code
      $("#soulnavbar").slideDown();

   }
   lastScrollTop = st;
});

http://jsfiddle.net/5n630gs2/1/

还有我在http://www.carbsanity.com/使用的网站

有人能告诉我为什么它在 Safari 上会这样吗？我能做些什么吗？ :-)

谢谢！

【问题讨论】：

标签： javascript jquery html ios css

【解决方案1】：

问题是移动浏览器不支持“真正的”滚动事件。滚动事件仅在窗口停止滚动后触发。它没有及时反应。

您需要第三方来处理您的滚动，例如 Iscroll。

【讨论】：