关闭模式将身体向上移动并在铬中打破滚动

时间:2016-12-14 21:50:23

标签: jquery css wordpress google-chrome zurb-foundation

当我从53更新到Chrome 55时,这开始发生在Chrome中。我正在使用WordPress with Foundation并打开媒体管理器在表单上添加文件。我不添加任何文件,只关闭窗口。一旦我关闭了模态页面跳转到页脚然后我只能向上滚动一半(如果有所不同,则隐藏顶部1700px)滚动条停止之前我无法进一步向上。我可以进行检查并在顶部添加1700px填充并再次查看所有内容。它还在模型打开之前在页脚下方添加了一堆空白区域,因此看起来它保持滚动条大小相同但只是将所有内容都移动了。

我有一些CSS设置:

body {
  overflow-y: hidden;
  position: relative;
}

body, html {
  width: 100%;
  overflow-x: hidden;
  position: relative;
}

我也尝试过修改身体上的“开放模式”课程,但没有运气

body.open-modal {
  overflow-y: auto;
  position: fixed;
}

我查看了所有内容,除了导航栏外,其他主体中没有固定元素。这在Firefox 50或IE 11上都没有发生。

1 个答案:

答案 0 :(得分:1)

这不是一个完美的解决方案,但似乎有效。我在基金会论坛上找到this answer,然后将我的CSS改为:

body.modal-open {
  overflow: visible;
}

现在当模态打开时,我的内容下面仍然有大量的空白区域,但滚动条变长,所以我可以向上滚动到顶部。关闭模态现在将我跳回到我单击打开模态并将滚动条恢复到正常的位置。这似乎是基金会5的一个问题。