【问题标题】:Magnific Popup shows scrollbar in front of lightboxMagnific Popup 在灯箱前显示滚动条
【发布时间】:2016-07-13 09:07:34
【问题描述】:

所以我一直使用 Magnific Popup 通过灯箱显示内容。

一开始我的问题是滚动条消失,灯箱后面的内容向右移动。

所以我添加了 html {溢出-y:滚动; } 现在滚动条仍然可见,并且没有向右移动。

问题是,滚动条在灯箱上方可见,我觉得这是不受欢迎的。

您可以在页面的简化版本中看到问题(点击占位符): http://test.ilgufoblu.net/lab/prova.html

不知道如何解决这个问题,如果它甚至可以修复的话。

【问题讨论】:

    标签: javascript jquery css magnific-popup


    【解决方案1】:

    在您的示例中,如果我将margin: 0;(您可以使用填充在视觉上重新创建)添加到body 并从html 中删除overflow-y: scroll(或将其替换为auto),我相信它的行为如预期的。这是一个小提琴:https://jsfiddle.net/523mcv1k/

    【讨论】:

    • 是的,行得通。我现在看到页面版本实际上过于精简,因为它仍然无法在更复杂的原始页面上运行。我想我将不得不发布一个新问题。谢谢。
    • 我认为在你的新代码中,为了让事情“工作”(即避免双滚动条并避免向右移动),你必须从 @987654328 中删除 overflow-y: scroll @,并且,在打开的回调中,将 padding-right: 17pxoverflow: hidden 添加到 body,然后在关闭回调中删除这些样式(通过在回调中添加/删除一个类到 html 可能是最简单/最干净的,我会想)。
    • 这是一个很好的观点。但是所有主流浏览器上的滚动条都是 17px 宽吗?让我检查一下。
    • 或多或少。我认为它在 Safari 上小于 17。
    • 我不明白为什么其他 Lightbox 插件的滚动条会停留在模态窗口下方。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多