jquery - 横向切换导航无法滚动

Question

在横向 View 中，我有一个打开的移动导航，但不会向下滚动以查看更多菜单选项。当导航完全关闭时这有点好，但是我在一个元素上有第二级切换，然后阻止我向下滚动。是否有我缺少的 CSS 修复？

它的样式并没有什么特别之处 - jQuery 在汉堡包菜单图标和“Solar Service”链接上打开/关闭以打开它。

注意 - 在响应模式 (Chrome) 中查看显示页面正在滚动，但导航不随窗口滚动。此 header 也是粘性的/固定在窗口的顶部。

菜单关闭

菜单打开

Answer 1

这不是很漂亮，但另一个 SO 帖子启发了以下解决方法

/* ----------- iPhone 5 and 5S ----------- */
  /* Landscape */
  @media only screen
    and (min-device-width: 320px)
    and (max-device-width: 568px)
    and (-webkit-min-device-pixel-ratio: 2)
    and (orientation: landscape) {
    height: 300px;
    max-height: 300px;
    overflow-y: scroll;
    -webkit-overflow-scrolling:touch; // mobile safari
  }

  /* ----------- iPhone 6 ----------- */
  /* Landscape */
  @media only screen
    and (min-device-width: 375px)
    and (max-device-width: 667px)
    and (-webkit-min-device-pixel-ratio: 2)
    and (orientation: landscape) {
    height: 300px;
    max-height: 300px;
    overflow-y: scroll;
    -webkit-overflow-scrolling:touch; // mobile safari
  }

  /* ----------- iPhone 6+ ----------- */
  /* Landscape */
  @media only screen
    and (min-device-width: 414px)
    and (max-device-width: 736px)
    and (-webkit-min-device-pixel-ratio: 3)
    and (orientation: landscape) {
    height: 300px;
    max-height: 300px;
    overflow-y: scroll;
    -webkit-overflow-scrolling:touch; // mobile safari
  }